Problem with an unofficial plugin on Node.js (ApexCharts)

, ,
#1

Hi,

the problem that I’m currently facing is that after recently having installed the otherwise majorly cool ApexCharts plugin, restarting the node server process produces the following error:

ReferenceError: window is not defined
    at $:/plugins/tiddlywiki-scss-com-au/apexcharts/apexcharts.common.js:7:381545
    at $:/plugins/tiddlywiki-scss-com-au/apexcharts/apexcharts.common.js:16:4
    at $tw.utils.evalGlobal ($:/boot/boot.js:642:12)
    at $tw.utils.evalSandboxed ($:/boot/boot.js:649:19)
    at $tw.modules.execute ($:/boot/boot.js:931:15)
    at require ($:/boot/boot.js:878:24)
    at $:/plugins/tiddlywiki-scss-com-au/apexcharts/widget.js:14:18
    at $:/plugins/tiddlywiki-scss-com-au/apexcharts/widget.js:343:4
    at $tw.utils.evalGlobal ($:/boot/boot.js:642:12)
    at $tw.utils.evalSandboxed ($:/boot/boot.js:649:19)

Since my wiki runs on my personal home server and is not a public-facing wiki, I’ve installed all plugins (apart from the official plugins that are bundled with the NPM package) the easy way, i.e. via drag-and-drop. This includes some community plugins and more than a dozen of my own custom extensions. All of these work without problems. The above error only occurs on Node.js, not when loading a standalone version of my wiki.

Is there a way to prevent ApexCharts from running its modules during the server startup phase? As far as I understand, the plugin doesn’t need to initialize anything on the server when it only renders its charts on the client side. Having the charts exportable via a server command is not something I need.

Is there a way to fix this?

#2

modify $:/plugins/tiddlywiki-scss-com-au/apexcharts/widget.js

you can put in if(!$tw.node) { as bellow and then at the end of the tiddler put a closing }

/*\
title: $:/plugins/tiddlywiki-scss-com-au/apexcharts/widget.js
type: application/javascript
module-type: widget

Wrapper for `apexcharts.common.js` that provides a `<$apexchart>` widget.

\*/

/*jslint node: true, browser: true */
/*global $tw: false */
"use strict";
if(!$tw.node) {
1 Like
#3

It could also be done like so:

if (!$tw.browser) return;

I don’t know that one method is particularly better or worse than the other.

1 Like
#4

That did fix the problem. Both suggested solutions work. Thanks!