module.exports = {
devServer: {
port: 3000,
progress: true,
compress: true
},
mode: 'production',
entry: './src/index.js',
output: {
filename: 'bundle.js',
path: path.resolve(__dirname, 'dist')
},
plugins: [
new HtmlWebpackPlugin({
template: './src/index.html',
filename: 'index.html',
minify: {
removeAttributeQuotes: true,
collapseInlineTagWhitespace: true
},
}),
new MiniCssExtractPlugin({
filename: 'main.css'
}),
new OptimizeCss()
],
module: {
rules: [{
test: /\.css$/,
use: [MiniCssExtractPlugin.loader, 'css-loader', 'postcss-loader',
]
},
{
test: /\.less$/,
use: [
MiniCssExtractPlugin.loader,
'css-loader',
'postcss-loader',
"less-loader" // compiles Less to CSS
]
},
]
},
optimization: {
minimizer: [new UglifyJsPlugin()],
},
}
其中的mode要设置为production才可以,如果是development,则没有压缩js的效果。