如何让更简洁的 webpack 插件正常工作 [英] How to get terser webpack plugin works properly
问题描述
我想了解如何让
这是我的 webpack 配置:
webpack/index.js
const webpack = require('webpack');const TerserPlugin = require('terser-webpack-plugin');模块.出口 = {模式:'无',模块: {规则: [{测试:/\.js$/,loader: 'babel-loader',选项: {预设:[['@babel/preset-env', {模块:假}]],babelrc:假}}]},插件: [新的 webpack.optimize.ModuleConcatenationPlugin()],优化: {最小化:[新的 TerserPlugin({})],}};
我不明白我在 webpack 配置中遗漏了什么.webpack 输出没有缩小或摇树...
<小时>节点:v10.10.0"
webpack: "^4.28.1"
webpack-cli: "^3.2.1"
@babel/core: "^7.2.2"
@babel/preset-env: "^7.1.5"
babel-loader: "^8.0.5"
terser-webpack-plugin: "^1.2.1"
看到您将 mode
设置为 none
,optimization.minimize
设置为 false
,因此您的 Terser 自定义实例永远不会被实例化.
将 minimize: true
添加到 optimization
对象,它应该可以工作.
I am trying to understand how to get terser webpack plugin to work in the most simple possible case.
This is my code:
src/math.js
, exports 2 functions.
export const double = (x) =>
x + x;
export const triple = (x) =>
x + x + x;
scr/index.js
, imports only double
function.
import { double } from './math.js';
console.log(double(10));
I understood from webpack documentation that I must use ModuleConcatenationPlugin
if I want activate tree shaking.
This is my webpack config:
webpack/index.js
const webpack = require('webpack');
const TerserPlugin = require('terser-webpack-plugin');
module.exports = {
mode: 'none',
module: {
rules: [
{
test: /\.js$/,
loader: 'babel-loader',
options: {
presets: [
['@babel/preset-env', {
modules: false
}]
],
babelrc: false
}
}
]
},
plugins: [
new webpack.optimize.ModuleConcatenationPlugin()
],
optimization: {
minimizer: [new TerserPlugin({})],
}
};
I don't understand what I missed in my webpack config. The webpack output is without minification or tree shaking...
node: "v10.10.0"
webpack: "^4.28.1"
webpack-cli: "^3.2.1"
@babel/core: "^7.2.2"
@babel/preset-env: "^7.1.5"
babel-loader: "^8.0.5"
terser-webpack-plugin: "^1.2.1"
Seeing that you have mode
set to none
, optimization.minimize
is set to false
, so your custom instance of Terser is never instantiated.
Add minimize: true
to the optimization
object and it should work.
这篇关于如何让更简洁的 webpack 插件正常工作的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!