Failed to Compile

[Abhistark7]

When using the first example mentioned on the npm homepage, Getting the following error :

Failed to compile.

./node_modules/vue3-chart-v2/src/components/BaseChart.js 92:28
Module parse failed: Unexpected token (92:28)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
| 
|         // REMOVE OLD DATA FIRST BEFORE UPDATE.
>         this.state.chartObj?.data?.datasets.pop()
| 
|         let ctx = this.$refs.canvas.getContext('2d')

[aryan29]

I am facing same issue_

[Abhistark7]

I am facing same issue_

Hey Aryan,

After a long day of finding a library for graph, which actually works, I stumbled upon this tutorial - https://www.freecodecamp.org/news/how-to-add-charts-and-graphs-to-a-vue-js-application-29f943a45d09/

You will also need to follow the comment on this stack overflow question to successfully implement the graph - https://stackoverflow.com/questions/66042305/vue-one-file-echarts-error-xaxis-0-not-found

Best of luck.

[aryan29]

I am facing same issue_

Hey Aryan,

After a long day of finding a library for graph, which actually works, I stumbled upon this tutorial - https://www.freecodecamp.org/news/how-to-add-charts-and-graphs-to-a-vue-js-application-29f943a45d09/

You will also need to follow the comment on this stack overflow question to successfully implement the graph - https://stackoverflow.com/questions/66042305/vue-one-file-echarts-error-xaxis-0-not-found

Best of luck.

You could have directly used cdn of chart.js by putting it in html or maybe installing it via npm and using it globally from main.js

[Mascerade]

It seems like there is some kind of issue using the optional chaining feature in JS in BaseChart.js. To fix it, instead of: this.state.chartObj?.data?.datasets.pop(), I replaced it with if (this.state.charObj != null && this.state.chartObj.data != null) { this.state.chartObj.data.datasets.pop() } That should fix the issue

[djom202]

I replaced locally and it's works, you should apply this change to the repo, so its great tool for vue v3.

[rfhstrong]

It seems like there is some kind of issue using the optional chaining feature in JS in BaseChart.js. To fix it, instead of: this.state.chartObj?.data?.datasets.pop(), I replaced it with if (this.state.charObj != null && this.state.chartObj.data != null) { this.state.chartObj.data.datasets.pop() } That should fix the issue

I had the same issue, it worked for me. Thanks!

[Mascerade]

I'll make a pull request with the change so that it doesn't happen to anyone else

[SamirM-BE]

Hello,

I have the same problem ! Here is a PR #3 solving the problem using the solution from @BinaryWiz .

@vutran6853 Can you merge please ?

[vutran6853]

Merge PR #3 should solve this issue. close