CODEWITHSUNDEEP
chart.jsaurelia
powerbuoy
powerbuoy

Reputation: 12838

Unable to ES6 import ChartJS plugin into Aurelia

I'm using chart.js in my Aurelia application and it works fine.

I now want to add the chartjs-plugin-deferred plugin as well, and after having npm install:ed it and added it to aurelia.json's dependencies array I now get the following error:

Uncaught TypeError: Cannot read property 'helpers' of undefined

Pointing to the first couple of lines in the plugin code:

var Chart = window.Chart;
var helpers = Chart.helpers;

(Note that I don't even need to use the plugin (import 'chartjs-plugin-deferred'; for the error to appear; as soon as it's added to aurelia.json I get errors).

If I add a console.dir(window.Chart) before the lines that throw errors it is in fact not undefined, and if I try to use the plugin in my charts it actually works fine.

Can someone explain why this error occurs and if there's some way I can get rid of it? I feel uncomfortable shipping code that, while it works as it should, throws errors in the console.

I'm a huge fan of npm and imports etc but more often than not you run into issues such as these which imo is such a hassle and actually makes me miss the good old days of just piling script elements on top of each other.

Edit: I tried with a couple more plugins just to see if perhaps the deferred plugin was the issue here, but every other plugin I tried completely kills the build.

Does anyone have experience importing ChartJS and a ChartJS plugin into Aurelia successfully?

Upvotes: 0

Views: 595

Answers (1)

zewa666
zewa666

Reputation: 2603

The issue at hand is that the library does not provide any meaningful way to jump in with a module loader and properly first fully load the dependency ChartJS before carrying on with the execution.

It would be the best if the library could wrap its code in a UMD compatible format to satisfy the most common formats at once, amongst those RequireJS, which is used for the Aurelia CLI.

I see you've created a Github Issue, including the libraries author as well. Good work, I've created a small PR to add the missing feature, which then also makes the example work, without throwing the missing helper error.

Upvotes: 2

Related Questions