chartjs / chartjs/chartjs-plugin-datalabels

Chartjs .js and .cjs are both imported when using chartjs-plugin-datalabels

Open
#400 0 comments 0 reactions 0 assignees View on GitHub
Dominant language
JavaScript
Stars
920
Forks
507
PR merge metrics
No merged PRs in 30d

Description

### 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:

```ts
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](https://github.com/kurkle/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](https://github.com/webpack-contrib/webpack-bundle-analyzer)

|*without `chartjs-plugin-datalabels`*|*with `chartjs-plugin-datalabels`*|
|-----|-----|
| image | image |
|only .js included|both .cjs & .js included|

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.