Chartjs .js and .cjs are both imported when using chartjs-plugin-datalabels
AoDev opened this issue · comments
Summary
Both the .js and .cjs versions of chart.js are imported and bundled when using this plugin.
Libs versions
- chart.js: 4.4.0
- chartjs-plugin-datalabels: 2.2.0
- react-chartjs-2: 5.2.0
- webpack: 5
Description
Both the .js
and .cjs
versions of chart.js are bundled in my react / typescript app when I use chartjs-plugin-datalabels
.
The app is bundled with Webpack 5. I verified that this issue does not happen if I don't import it.
The plugin is imported like so:
import {Chart as ChartJS} from 'chart.js'
import ChartDataLabels from 'chartjs-plugin-datalabels'
ChartJS.register(ChartDataLabels)
Note that it is specifically the register(...)
line that causes the problem.
If I import the plugin but not register it, there is no duplication
Further investigation
I don't know if the problem is chart.js or datalabels so I decided to test with another plugin.
I tried with chartjs-plugin-autocolors and can confirm the duplication issue does not happen.
So, at the moment I decided to write the issue here.
Screenshots
Checked with the BundleAnalyzerPlugin
without chartjs-plugin-datalabels |
with chartjs-plugin-datalabels |
---|---|
![]() |
![]() |
only .js included | both .cjs & .js included |