Apexcharts.js: [React] BrushChart Unhandled Rejection (ReferenceError) ApexCharts is not defined

[AurelReb]

CodeSandbox

Explanation

• What is the behavior you expect?

a chart and a brushChart as the demo in the official website of ApexCharts

• What is happening instead?

There is an error : Unhandled Rejection (ReferenceError) ApexCharts is not defined

[AurelReb]

Alright I've found what's the issue !
in the apexcharts website, the imports are from here : https://cdn.jsdelivr.net/npm/apexcharts
the problem is that it's not the same version as the npm import apexcharts !
By searching version in source code, I found 2.5.7 whereas the version on npm and github is 2.5.1 why ??

So by taking the link above in import, the issue is fix... But in npm, I don't know how to import this file rather than the official

[junedchhipa]

Hi,
2.5.1 is the last version of ApexCharts. Maybe you're mistaken somewhere.

But, the issue is ReactApexCharts expects ApexCharts to be present in global window var. Currently, importing just React-ApexCharts won't do this.

I will fix it in the next version of React-ApexCharts.

[junedchhipa]

Fixed it.
Please upgrade react-apexcharts to 1.2.1

Here is the updated codepen using the latest version
https://codesandbox.io/s/7wk7ykp9j1

[AurelReb]

Wow thank you very much ! I'll test it soon
Happy new year ;)

[Vadim1Korniychuk]

Excuse me, I see the same problem in vue-apexcharts library (v. 1.3.0 latest).

[junedchhipa]

I just released v1.3.1 (vue-apexcharts).
Can you please test by upgrading to it?

[violacambie]

Hi @junedchhipa I'm having the same issue using the npm "apexcharts": "^3.20.0"
I 'm working with javascript/typescipt. I don't use React but I was wondering if you could show me how to fix this problem. Maybe I can apply the same logic to the Typescipt library. Thanks!