Skip to content

Commit ff0a98c

Browse files
authored
feat(bundler): Migrate babel -> esbuild
- Migrate transpiler: babel -> esbuild - Update related plugins: css-minimizer-webpack-plugin, terser-webpack-plugin -> esbuild built-in Fix #3601
1 parent f8758aa commit ff0a98c

15 files changed

+459
-1856
lines changed

README.md

+1-5
Original file line numberDiff line numberDiff line change
@@ -170,16 +170,12 @@ If you want to use 'billboard.js' without installation, load files directly from
170170

171171
## Supported Browsers
172172

173-
> - Basically will work on all SVG supported browsers.
173+
> - Basically will work on all SVG and ES6+ supported browsers.
174174
> - <sup>*</sup>Notes for legacy browsers:
175175
> - Recommended to use `packaged` build or construct your own build following [`How to bundle for legacy browsers?`](https://github.com/naver/billboard.js/wiki/How-to-bundle-for-legacy-browsers%3F) instruction.
176176
> - D3.js dropped the support of legacy browsers since [v6](https://observablehq.com/@d3/d3v6-migration-guide).
177177
> - The support isn't fully guaranteed.
178178
179-
|Internet Explorer|Chrome|Firefox|Safari|iOS|Android|
180-
|---|---|---|---|---|---|
181-
|9+<sup>*</sup>|Latest|Latest|Latest|8+|4+|
182-
183179

184180
## Dependency by version
185181

babel.config.cjs

-50
This file was deleted.

config/rollup/esm.js

-4
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
import {readdirSync} from "fs";
2-
import babel from '@rollup/plugin-babel';
32
import typescript from "@rollup/plugin-typescript";
43
import resolve from "@rollup/plugin-node-resolve";
54
import replace from "@rollup/plugin-replace";
@@ -26,9 +25,6 @@ const plugins = [
2625
runOnce: true
2726
}),
2827
resolve(),
29-
babel({
30-
babelHelpers: "runtime"
31-
}),
3228
typescript(),
3329
replace({
3430
"__VERSION__": version,

config/terserConfig.cjs

-18
This file was deleted.

config/webpack/packaged.cjs

+8-4
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,7 @@
11
const {merge} = require("webpack-merge");
22
const webpack = require("webpack");
3-
const TerserPlugin = require("terser-webpack-plugin");
4-
const terserConfig = require("../terserConfig.cjs");
53
const banner = require("../template/banner.cjs");
6-
4+
const {EsbuildPlugin} = require("esbuild-loader");
75

86
const config = {
97
entry: {
@@ -13,7 +11,13 @@ const config = {
1311
optimization: {
1412
usedExports: true,
1513
minimize: true,
16-
minimizer: [new TerserPlugin(terserConfig)]
14+
minimizer: [
15+
new EsbuildPlugin({
16+
include: /\.min\.js$/,
17+
target: "es2015",
18+
format: undefined
19+
})
20+
]
1721
},
1822
plugins: [
1923
new webpack.BannerPlugin({

config/webpack/plugin.cjs

+7-3
Original file line numberDiff line numberDiff line change
@@ -3,9 +3,8 @@ const webpack = require("webpack");
33
const fs = require("fs");
44
const path = require("path");
55
const CleanWebpackPlugin = require("clean-webpack-plugin").CleanWebpackPlugin;
6-
const TerserPlugin = require("terser-webpack-plugin");
7-
const terserConfig = require("../terserConfig.cjs");
86
const banner = require("../template/banner.cjs");
7+
const {EsbuildPlugin} = require("esbuild-loader");
98

109
const srcPath = "./src/Plugin/";
1110
const distPath = path.resolve(__dirname, "../../dist/plugin/");
@@ -68,7 +67,12 @@ module.exports = (common, env) => {
6867
config.optimization = {
6968
usedExports: true,
7069
minimize: true,
71-
minimizer: [new TerserPlugin(terserConfig)]
70+
minimizer: [
71+
new EsbuildPlugin({
72+
target: "es2015",
73+
format: undefined
74+
})
75+
]
7276
};
7377
}
7478

config/webpack/production.cjs

+6-13
Original file line numberDiff line numberDiff line change
@@ -2,10 +2,8 @@ const {merge} = require("webpack-merge");
22
const webpack = require("webpack");
33
const path = require("path");
44
const CleanWebpackPlugin = require("clean-webpack-plugin").CleanWebpackPlugin;
5-
const TerserPlugin = require("terser-webpack-plugin");
6-
const terserConfig = require("../terserConfig.cjs");
75
const banner = require("../template/banner.cjs");
8-
const CssMinimizerPlugin = require("css-minimizer-webpack-plugin");
6+
const {EsbuildPlugin} = require("esbuild-loader");
97
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
108
const ESLintPlugin = require("eslint-webpack-plugin");
119

@@ -32,16 +30,11 @@ const config = {
3230
usedExports: true,
3331
minimize: true,
3432
minimizer: [
35-
new TerserPlugin(terserConfig),
36-
new CssMinimizerPlugin({
37-
test: /\.min\.css$/i,
38-
minimizerOptions: {
39-
preset: [
40-
"default", {
41-
discardComments: true
42-
}
43-
]
44-
}
33+
new EsbuildPlugin({
34+
include: /\.min\.(js|css)$/,
35+
target: "es2015",
36+
css: true,
37+
format: undefined
4538
})
4639
]
4740
},

config/webpack/theme.cjs

+6-10
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ const path = require("path");
55
const CleanWebpackPlugin = require("clean-webpack-plugin").CleanWebpackPlugin;
66
const WebpackCleanPlugin = require("webpack-clean");
77
const banner = require("../template/banner.cjs");
8-
const CssMinimizerPlugin = require("css-minimizer-webpack-plugin");
8+
const {EsbuildPlugin} = require("esbuild-loader");
99
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
1010

1111
const srcPath = "./src/scss/theme/";
@@ -47,15 +47,11 @@ const config = {
4747
optimization: {
4848
minimize: true,
4949
minimizer: [
50-
new CssMinimizerPlugin({
51-
test: /\.min\.css$/i,
52-
minimizerOptions: {
53-
preset: [
54-
"default", {
55-
discardComments: true
56-
}
57-
]
58-
}
50+
new EsbuildPlugin({
51+
include: /\.min\.css$/,
52+
target: "es2015",
53+
css: true,
54+
format: undefined
5955
})
6056
]
6157
},

karma.conf.cjs

+5-2
Original file line numberDiff line numberDiff line change
@@ -64,8 +64,11 @@ module.exports = function(config) {
6464
}
6565
},
6666
{
67-
test: /(\.[jt]s)$/,
68-
loader: "babel-loader",
67+
test: /\.[jt]s$/,
68+
loader: "esbuild-loader",
69+
options: {
70+
target: "es2015"
71+
},
6972
exclude: {
7073
and: [/node_modules/],
7174
not: [/(d3\-.*)$/, /internmap/]

package.json

+5-26
Original file line numberDiff line numberDiff line change
@@ -101,17 +101,8 @@
101101
"d3-zoom": "^3.0.0"
102102
},
103103
"devDependencies": {
104-
"@babel/core": "^7.24.0",
105-
"@babel/eslint-parser": "^7.23.10",
106-
"@babel/plugin-proposal-class-properties": "^7.18.6",
107-
"@babel/plugin-proposal-object-rest-spread": "^7.20.7",
108-
"@babel/plugin-transform-runtime": "^7.24.0",
109-
"@babel/preset-env": "^7.24.0",
110-
"@babel/preset-typescript": "^7.23.3",
111-
"@babel/runtime": "^7.24.0",
112-
"@commitlint/cli": "19.0.3",
113-
"@commitlint/config-conventional": "^19.0.3",
114-
"@rollup/plugin-babel": "^6.0.4",
104+
"@commitlint/cli": "18.6.1",
105+
"@commitlint/config-conventional": "^18.6.2",
115106
"@rollup/plugin-node-resolve": "^15.2.3",
116107
"@rollup/plugin-replace": "^5.0.5",
117108
"@rollup/plugin-typescript": "^11.1.6",
@@ -125,19 +116,8 @@
125116
"@types/d3": "^7.4.3",
126117
"@types/mocha": "^10.0.6",
127118
"@types/sinon": "^17.0.3",
128-
"@typescript-eslint/eslint-plugin": "^7.2.0",
129-
"@typescript-eslint/parser": "^7.2.0",
130-
"babel-helper-modules": "^6.0.0",
131-
"babel-loader": "^9.1.3",
132-
"babel-plugin-add-module-exports": "^1.0.4",
133-
"babel-plugin-minify-constant-folding": "^0.5.0",
134-
"babel-plugin-minify-dead-code-elimination": "^0.5.2",
135-
"babel-plugin-minify-guarded-expressions": "^0.4.4",
136-
"babel-plugin-minify-numeric-literals": "^0.4.3",
137-
"babel-plugin-minify-type-constructors": "^0.4.3",
138-
"babel-plugin-transform-inline-consecutive-adds": "^0.4.3",
139-
"babel-plugin-transform-merge-sibling-variables": "^6.9.5",
140-
"babel-plugin-transform-minify-booleans": "^6.9.4",
119+
"@typescript-eslint/eslint-plugin": "^7.1.0",
120+
"@typescript-eslint/parser": "^7.1.0",
141121
"better-docs": "^2.7.3",
142122
"chai": "^4.3.10",
143123
"clean-webpack-plugin": "^4.0.0",
@@ -146,12 +126,12 @@
146126
"coveralls": "^3.1.1",
147127
"cross-env": "^7.0.3",
148128
"css-loader": "^6.10.0",
149-
"css-minimizer-webpack-plugin": "^6.0.0",
150129
"d3-color": "^3.1.0",
151130
"d3-delaunay": "^6.0.4",
152131
"d3-format": "^3.1.0",
153132
"d3-polygon": "^3.0.1",
154133
"docdash": "^2.0.2",
134+
"esbuild-loader": "^4.0.3",
155135
"eslint": "^8.57.0",
156136
"eslint-config-naver": "^2.1.0",
157137
"eslint-plugin-import": "^2.29.1",
@@ -188,7 +168,6 @@
188168
"string-replace-loader": "^3.1.0",
189169
"style-loader": "^3.3.4",
190170
"taffydb": "^2.7.3",
191-
"terser-webpack-plugin": "^5.3.10",
192171
"tslib": "^2.6.2",
193172
"typescript": "5.4.2",
194173
"webpack": "^5.90.3",

test/api/chart-spec.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -111,7 +111,7 @@ describe("API chart", () => {
111111
// all methods should be ressetted
112112
Object.keys(chart).forEach(key => {
113113
expect(chart[key]()).to.be.undefined;
114-
expect(/^function()/.test(chart[key].toString())).to.be.true;
114+
expect(/^\(\)\s?=\>\s?\{/.test(chart[key].toString())).to.be.true;
115115
});
116116

117117
expect(bb.instance.indexOf(chart) === -1).to.be.true;

test/interactions/subchart-spec.ts

+4
Original file line numberDiff line numberDiff line change
@@ -581,6 +581,8 @@ describe("SUBCHART", () => {
581581
expect(
582582
this.internal.$el.subchart.main.selectAll(`.${$LINE.line}-data1`).size()
583583
).to.be.equal(1);
584+
585+
done();
584586
}
585587
});
586588
});
@@ -602,6 +604,8 @@ describe("SUBCHART", () => {
602604
expect(
603605
main.selectAll(`.${$LINE.line}-data2`).size()
604606
).to.be.equal(1);
607+
608+
done();
605609
}
606610
});
607611
});

test/shape/arc-spec.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -717,15 +717,15 @@ describe("SHAPE ARC", () => {
717717
checkExpand(done);
718718
});
719719

720-
it("set options: data.type='donut'", done => {
720+
it("set options: data.type='donut'", () => {
721721
args.data.type = "donut";
722722
});
723723

724724
it("check Donut's expand", done => {
725725
checkExpand(done);
726726
});
727727

728-
it("set options: data.type='gauge'", done => {
728+
it("set options: data.type='gauge'", () => {
729729
args.data.type = "donut";
730730
});
731731

webpack.config.cjs

+5-2
Original file line numberDiff line numberDiff line change
@@ -44,8 +44,11 @@ const config = {
4444
module: {
4545
rules: [
4646
{
47-
test: /(\.[jt]s)$/,
48-
loader: "babel-loader",
47+
test: /\.[jt]s$/,
48+
loader: "esbuild-loader",
49+
options: {
50+
target: "es2015"
51+
},
4952
exclude: {
5053
and: [/node_modules/],
5154
not: [/(d3\-.*)$/, /internmap/]

0 commit comments

Comments
 (0)