使用chart.js 2.5.0和webpack 2.2.1,最小化后得到的包为357K。我已经尝试过各种方法来选择Uglify,但似乎没有多大关系。
使用这些文件:
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Hello webpack</title>
</head>
<body>
<div id="root"></div>
<script src="dist/bundle.js"></script>
</body>
src / app.js
import Chart from 'chart.js'
const root = document.querySelector('#root')
root.innerHTML = `<p>Hello webpack.</p>`
webpack.config.js
const webpack = require('webpack')
const path = require('path')
module.exports = {
context: path.resolve(__dirname, 'src'),
entry: './app.js',
output: {
path: path.resolve(__dirname, 'dist'),
filename: 'bundle.js'
},
module: {
rules: [{
test: /\.js$/,
include: path.resolve(__dirname, 'src'),
use: [{
loader: 'babel-loader',
options: {
presets: [
['es2015', { modules: false }]
]
}
}]
}]
}
}
package.json
{
"name": "webpack-demo",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"start": "webpack --watch",
"build": "webpack -p"
},
"keywords": [],
"author": "",
"license": "ISC",
"devDependencies": {
"babel-core": "^6.23.1",
"babel-loader": "^6.3.1",
"babel-preset-es2015": "^6.22.0",
"chart.js": "^2.5.0",
"webpack": "^2.2.1"
}
}
运行npm run build]的示例:]
Hash: 72bbbb910dcee63f84e8
Version: webpack 2.2.1
Time: 3892ms
Asset Size Chunks Chunk Names
bundle.js 357 kB 0 [emitted] [big] main
[109] ../~/chart.js/src/chart.js 1.91 kB {0} [built]
[128] ../~/chart.js/src/core/core.helpers.js 30.2 kB {0} [built]
[136] ../~/chart.js/src/core/core.ticks.js 7.03 kB {0} [built]
[137] ../~/chart.js/src/core/core.title.js 5.39 kB {0} [built]
[138] ../~/chart.js/src/core/core.tooltip.js 24.5 kB {0} [built]
[139] ../~/chart.js/src/elements/element.arc.js 2.62 kB {0} [built]
[140] ../~/chart.js/src/elements/element.line.js 5.32 kB {0} [built]
[141] ../~/chart.js/src/elements/element.point.js 2.85 kB {0} [built]
[142] ../~/chart.js/src/elements/element.rectangle.js 5.13 kB {0} [built]
[144] ../~/chart.js/src/platforms/platform.js 2.83 kB {0} [built]
[145] ../~/chart.js/src/scales/scale.category.js 3.73 kB {0} [built]
[146] ../~/chart.js/src/scales/scale.linear.js 5.5 kB {0} [built]
[147] ../~/chart.js/src/scales/scale.linearbase.js 2.69 kB {0} [built]
[149] ../~/chart.js/src/scales/scale.radialLinear.js 16.2 kB {0} [built]
[158] ./app.js 116 bytes {0} [built]
+ 144 hidden modules
使用chart.js 2.5.0和webpack 2.2.1,最小化后得到的包为357K。我已经尝试过各种方法来选择Uglify,但似乎没有多大关系。使用以下文件:index.html
结果是npm中的chart.js取决于moment.js,其中包括大约250K的语言环境。解决方法是忽略这些语言环境文件:
如JOP