Comment on page
Log : Optimize bundle size
Nhật kí optimize bundle size webpack react-boilerplate
7.95 MB
7.87 MB
8.22 MB
7.87 MB
7.87 MB
7.87 MB
Total : 7.95mb

- Total : 7.87mb
- Giảm: 7.95 - 7.87 = 0.08mb
- Total : 7.95mb
- ant css: 1.97mb
- ant lib: 1.57mb
- ant es: 1.55mb
- optimize babel-plugin-import
- load lybrary từ lib thành es
babel.config.js
lugins: [
[
"import", {
"libraryName": "antd",
"style": true
}
]
]
babel.config.js ( cập nhật )
plugins: [
[
"import", {
"libraryName": "antd",
"libraryDirectory": "es",
"style": true
}
]
]
=> build check analyze

- Total : 8.22mb
- Tăng : 8.22 - 7.87 = 0.35mb
- Total : 7.95mb
- ant css: 1.97mb
- ant lib: 1.57mb
- ant es: 1.mb
- optimize babel-plugin-import
- style true => css
babel.config.js
lugins: [
[
"import", {
"libraryName": "antd",
"libraryDirectory": "es",
"style": true
}
]
]
babel.config.js ( cập nhật )
plugins: [
[
"import", {
"libraryName": "antd",
"libraryDirectory": "es",
"style": "css"
}
]
]
- Total : 7.87mb
- Giảm : 8.22 - 7.87 = 0.35mb
- Total : 8.22mb
- ant css: 1.97mb
- ant lib: 1.57mb
- ant es: 1.mb
- optimize babel-plugin-import
- style css => true
- upgrace babel-plugin-import từ bản 1.12.0 -> 1.13.3
- css =>
babel.config.js
lugins: [
[
"import", {
"libraryName": "antd",
"libraryDirectory": "es",
"style": true
}
]
]
babel.config.js ( cập nhật )
plugins: [
[
"import", {
"libraryName": "antd",
"libraryDirectory": "es",
"style": "css"
}
]
]
2. upgrade babel-plugin-import ( 1.12.0 -> 1.13.3 )
$ npm install --save-dev [email protected].
- Total : 7.87mb
- Giảm : 7.87 - 7.87 = 0mb
- Total : 7.87mb
- optimize load file locate: en-gb & vi ( tiếng anh mỹ & tiếng việt )
webpack.base.babel.js
plugins: [
// load `moment/locale/en-gb.js` and `moment/locale/vi.js`
new webpack.ContextReplacementPlugin(/moment[/\\]locale$/, /en-gb|vi/),
]
babel-plugin-transform-imports
Last modified 2yr ago