Fra*_*ain 7 webpack babel-polyfill tree-shaking babel-loader
我尝试使webpack 树摇动删除未使用babel-polyfill.
index.js 文件包含:
import 'babel-polyfill'
const add4 = n => n + 4
const add5 = n => n + 5
add4(6)
console.log('boom', add4(4))
Run Code Online (Sandbox Code Playgroud)
在这个文件中没有代码需要任何es2015 + polyfill,所以我期望树摇动删除捆绑输出中未使用的babel-polyfill.事实并非如此,捆绑包仍然包含它们(缩小).
webpack配置:
const MinifyPlugin = require('babel-minify-webpack-plugin')
module.exports = {
entry: './index.js',
output: {
filename: 'bundle-webpack.js'
},
module: {
rules: [
{
test: /\.js$/,
exclude: /node_modules/,
use: {
loader: 'babel-loader'
}
}
]
},
plugins: [
new MinifyPlugin({ mangle: { topLevel: true } }, { comments: false })
]
}
Run Code Online (Sandbox Code Playgroud)
并且.babelrc:
{
"presets": [
[
"env",
{
"targets": {
"browsers": ["chrome >= 50", "iOS >= 10", "ie >= 8"]
},
"useBuiltIns": true,
"modules": false,
"loose": true
}
]
]
}
Run Code Online (Sandbox Code Playgroud)
我试图取代babel-minify-webpack-plugin用uglifyjs-webpack-plugin,但它给了相同的结果.
如何使树摇动工作,输出不包含babel-polyfills原始代码中未使用的任何内容?
| 归档时间: |
|
| 查看次数: |
986 次 |
| 最近记录: |