Skip to content

Commit 7fd4ae4

Browse files
authored
feat: upgrade Chart.js to v4 (#960)
Chart.js v4 support BREAKING CHANGE: package now is ESM-only, no CommonJS support
1 parent 5ab27bc commit 7fd4ae4

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

51 files changed

+139
-144
lines changed

.eslintrc.js .eslintrc.cjs

+1-1
Original file line numberDiff line numberDiff line change
@@ -31,5 +31,5 @@ module.exports = {
3131
}
3232
}
3333
],
34-
ignorePatterns: ['dist/**/*', 'node_modules/**/*', 'rollup.config.mjs']
34+
ignorePatterns: ['dist/**/*', 'node_modules/**/*', 'rollup.config.js']
3535
}

.size-limit.json

-11
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,4 @@
11
[
2-
{
3-
"path": "dist/index.cjs",
4-
"limit": "1.75 KB",
5-
"webpack": false,
6-
"running": false
7-
},
8-
{
9-
"path": "dist/index.cjs",
10-
"limit": "1 KB",
11-
"import": "{ Bar }"
12-
},
132
{
143
"path": "dist/index.js",
154
"limit": "1.7 KB",

.storybook/manager.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { addons } from '@storybook/addons'
22

3-
import { theme } from './theme'
3+
import { theme } from './theme.js'
44

55
addons.setConfig({
66
theme,

.storybook/package.json

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
{
2+
"type": "commonjs"
3+
}

package.json

+7-4
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
{
22
"name": "vue-chartjs",
3+
"type": "module",
34
"version": "4.1.2",
45
"description": "Vue.js wrapper for chart.js for creating beautiful charts.",
56
"author": "Jakub Juszczak <[email protected]>",
@@ -37,11 +38,13 @@
3738
"Charts"
3839
],
3940
"sideEffects": false,
40-
"main": "./src/index.ts",
4141
"types": "./dist/index.d.ts",
42+
"exports": "./src/index.ts",
4243
"publishConfig": {
43-
"main": "./dist/index.cjs",
44-
"module": "./dist/index.js",
44+
"exports": {
45+
"import": "./dist/index.js",
46+
"types": "./dist/index.d.ts"
47+
},
4548
"directory": "package"
4649
},
4750
"files": [
@@ -68,7 +71,7 @@
6871
"updateGitHooks": "simple-git-hooks"
6972
},
7073
"peerDependencies": {
71-
"chart.js": "^3.7.0",
74+
"chart.js": "^4.0.0",
7275
"vue": "^3.0.0-0 || ^2.6.0"
7376
},
7477
"devDependencies": {

rollup.config.js

+32
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
import { swc } from 'rollup-plugin-swc3'
2+
import { nodeResolve } from '@rollup/plugin-node-resolve'
3+
import pkg from './package.json' assert { type: 'json' }
4+
5+
const extensions = ['.js', '.ts']
6+
const external = _ => /node_modules/.test(_) && !/@swc\/helpers/.test(_)
7+
const plugins = targets => [
8+
nodeResolve({
9+
extensions
10+
}),
11+
swc({
12+
tsconfig: false,
13+
env: {
14+
targets
15+
},
16+
module: {
17+
type: 'es6'
18+
},
19+
sourceMaps: true
20+
})
21+
]
22+
23+
export default {
24+
input: pkg.exports,
25+
plugins: plugins('defaults and supports es6-module'),
26+
external,
27+
output: {
28+
format: 'es',
29+
file: pkg.publishConfig.exports.import,
30+
sourcemap: true
31+
}
32+
}

rollup.config.mjs

-45
This file was deleted.

sandboxes/bar/package.json

+3-2
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,12 @@
11
{
2+
"type": "module",
23
"scripts": {
34
"start": "vite"
45
},
56
"dependencies": {
6-
"chart.js": "^3.8.0",
7+
"chart.js": "^4.0.0",
78
"vue": "^3.2.31",
8-
"vue-chartjs": "^4.0.0"
9+
"vue-chartjs": "^5.0.0"
910
},
1011
"devDependencies": {
1112
"@vitejs/plugin-vue": "^3.0.1",

sandboxes/bar/src/App.vue

+1-1
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ import {
1313
LinearScale
1414
} from 'chart.js'
1515
import { Bar } from 'vue-chartjs'
16-
import * as chartConfig from './chartConfig'
16+
import * as chartConfig from './chartConfig.js'
1717
1818
ChartJS.register(CategoryScale, LinearScale, BarElement, Title, Tooltip, Legend)
1919

sandboxes/bubble/package.json

+3-2
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,12 @@
11
{
2+
"type": "module",
23
"scripts": {
34
"start": "vite"
45
},
56
"dependencies": {
6-
"chart.js": "^3.8.0",
7+
"chart.js": "^4.0.0",
78
"vue": "^3.2.31",
8-
"vue-chartjs": "^4.0.0"
9+
"vue-chartjs": "^5.0.0"
910
},
1011
"devDependencies": {
1112
"@vitejs/plugin-vue": "^3.0.1",

sandboxes/bubble/src/App.vue

+1-1
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ import {
1111
LinearScale
1212
} from 'chart.js'
1313
import { Bubble } from 'vue-chartjs'
14-
import * as chartConfig from './chartConfig'
14+
import * as chartConfig from './chartConfig.js'
1515
1616
ChartJS.register(LinearScale, PointElement, Tooltip, Legend)
1717

sandboxes/custom/package.json

+3-2
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,12 @@
11
{
2+
"type": "module",
23
"scripts": {
34
"start": "vite"
45
},
56
"dependencies": {
6-
"chart.js": "^3.8.0",
7+
"chart.js": "^4.0.0",
78
"vue": "^3.2.31",
8-
"vue-chartjs": "^4.0.0"
9+
"vue-chartjs": "^5.0.0"
910
},
1011
"devDependencies": {
1112
"@vitejs/plugin-vue": "^3.0.1",

sandboxes/custom/src/App.vue

+2-2
Original file line numberDiff line numberDiff line change
@@ -13,8 +13,8 @@ import {
1313
Tooltip,
1414
Legend
1515
} from 'chart.js'
16-
import LineWithLineChart from './components/LineWithLineChart'
17-
import * as chartConfig from './chartConfig'
16+
import LineWithLineChart from './components/LineWithLineChart.js'
17+
import * as chartConfig from './chartConfig.js'
1818
1919
ChartJS.register(
2020
CategoryScale,

sandboxes/doughnut/package.json

+3-2
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,12 @@
11
{
2+
"type": "module",
23
"scripts": {
34
"start": "vite"
45
},
56
"dependencies": {
6-
"chart.js": "^3.8.0",
7+
"chart.js": "^4.0.0",
78
"vue": "^3.2.31",
8-
"vue-chartjs": "^4.0.0"
9+
"vue-chartjs": "^5.0.0"
910
},
1011
"devDependencies": {
1112
"@vitejs/plugin-vue": "^3.0.1",

sandboxes/doughnut/src/App.vue

+1-1
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
<script lang="ts">
66
import { Chart as ChartJS, ArcElement, Tooltip, Legend } from 'chart.js'
77
import { Doughnut } from 'vue-chartjs'
8-
import * as chartConfig from './chartConfig'
8+
import * as chartConfig from './chartConfig.js'
99
1010
ChartJS.register(ArcElement, Tooltip, Legend)
1111

sandboxes/line/package.json

+3-2
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,12 @@
11
{
2+
"type": "module",
23
"scripts": {
34
"start": "vite"
45
},
56
"dependencies": {
6-
"chart.js": "^3.8.0",
7+
"chart.js": "^4.0.0",
78
"vue": "^3.2.31",
8-
"vue-chartjs": "^4.0.0"
9+
"vue-chartjs": "^5.0.0"
910
},
1011
"devDependencies": {
1112
"@vitejs/plugin-vue": "^3.0.1",

sandboxes/line/src/App.vue

+1-1
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ import {
1414
Legend
1515
} from 'chart.js'
1616
import { Line } from 'vue-chartjs'
17-
import * as chartConfig from './chartConfig'
17+
import * as chartConfig from './chartConfig.js'
1818
1919
ChartJS.register(
2020
CategoryScale,

sandboxes/pie/package.json

+3-2
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,12 @@
11
{
2+
"type": "module",
23
"scripts": {
34
"start": "vite"
45
},
56
"dependencies": {
6-
"chart.js": "^3.8.0",
7+
"chart.js": "^4.0.0",
78
"vue": "^3.2.31",
8-
"vue-chartjs": "^4.0.0"
9+
"vue-chartjs": "^5.0.0"
910
},
1011
"devDependencies": {
1112
"@vitejs/plugin-vue": "^3.0.1",

sandboxes/pie/src/App.vue

+1-1
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
<script lang="ts">
66
import { Chart as ChartJS, ArcElement, Tooltip, Legend } from 'chart.js'
77
import { Pie } from 'vue-chartjs'
8-
import * as chartConfig from './chartConfig'
8+
import * as chartConfig from './chartConfig.js'
99
1010
ChartJS.register(ArcElement, Tooltip, Legend)
1111

sandboxes/polar-area/src/App.vue

+1-1
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ import {
1111
Legend
1212
} from 'chart.js'
1313
import { PolarArea } from 'vue-chartjs'
14-
import * as chartConfig from './chartConfig'
14+
import * as chartConfig from './chartConfig.js'
1515
1616
ChartJS.register(RadialLinearScale, ArcElement, Tooltip, Legend)
1717

sandboxes/radar/package.json

+3-2
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,12 @@
11
{
2+
"type": "module",
23
"scripts": {
34
"start": "vite"
45
},
56
"dependencies": {
6-
"chart.js": "^3.8.0",
7+
"chart.js": "^4.0.0",
78
"vue": "^3.2.31",
8-
"vue-chartjs": "^4.0.0"
9+
"vue-chartjs": "^5.0.0"
910
},
1011
"devDependencies": {
1112
"@vitejs/plugin-vue": "^3.0.1",

sandboxes/radar/src/App.vue

+1-1
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ import {
1313
Legend
1414
} from 'chart.js'
1515
import { Radar } from 'vue-chartjs'
16-
import * as chartConfig from './chartConfig'
16+
import * as chartConfig from './chartConfig.js'
1717
1818
ChartJS.register(
1919
RadialLinearScale,

sandboxes/reactive/package.json

+3-2
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,12 @@
11
{
2+
"type": "module",
23
"scripts": {
34
"start": "vite"
45
},
56
"dependencies": {
6-
"chart.js": "^3.8.0",
7+
"chart.js": "^4.0.0",
78
"vue": "^3.2.31",
8-
"vue-chartjs": "^4.0.0"
9+
"vue-chartjs": "^5.0.0"
910
},
1011
"devDependencies": {
1112
"@vitejs/plugin-vue": "^3.0.1",

sandboxes/reactive/src/App.vue

+1-1
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@ import {
1515
ChartData
1616
} from 'chart.js'
1717
import { Bar } from 'vue-chartjs'
18-
import * as chartConfig from './chartConfig'
18+
import * as chartConfig from './chartConfig.js'
1919
2020
ChartJS.register(Title, Tooltip, Legend, BarElement, CategoryScale, LinearScale)
2121

sandboxes/scatter/package.json

+3-2
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,12 @@
11
{
2+
"type": "module",
23
"scripts": {
34
"start": "vite"
45
},
56
"dependencies": {
6-
"chart.js": "^3.8.0",
7+
"chart.js": "^4.0.0",
78
"vue": "^3.2.31",
8-
"vue-chartjs": "^4.0.0"
9+
"vue-chartjs": "^5.0.0"
910
},
1011
"devDependencies": {
1112
"@vitejs/plugin-vue": "^3.0.1",

sandboxes/scatter/src/App.vue

+1-1
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ import {
1212
Legend
1313
} from 'chart.js'
1414
import { Scatter } from 'vue-chartjs'
15-
import * as chartConfig from './chartConfig'
15+
import * as chartConfig from './chartConfig.js'
1616
1717
ChartJS.register(LinearScale, PointElement, LineElement, Tooltip, Legend)
1818

src/chart.ts

+4-3
Original file line numberDiff line numberDiff line change
@@ -9,15 +9,16 @@ import {
99
toRaw
1010
} from 'vue'
1111
import { Chart as ChartJS } from 'chart.js'
12-
import { Props } from './props'
12+
import type { ChartComponent } from './types.js'
13+
import { Props } from './props.js'
1314
import {
1415
cloneData,
1516
setLabels,
1617
setDatasets,
1718
setOptions,
1819
toRawIfProxy,
1920
cloneProxy
20-
} from './utils'
21+
} from './utils.js'
2122

2223
export const Chart = defineComponent({
2324
props: Props,
@@ -113,4 +114,4 @@ export const Chart = defineComponent({
113114
})
114115
}
115116
}
116-
})
117+
}) as ChartComponent

0 commit comments

Comments
 (0)