59 lines
2.2 KiB
JavaScript
59 lines
2.2 KiB
JavaScript
const { merge } = require('webpack-merge')
|
|
const baseConfig = require('./webpack.base.js')
|
|
const CompressionPlugin = require("compression-webpack-plugin");
|
|
const { BundleAnalyzerPlugin } = require("webpack-bundle-analyzer");
|
|
const TerserPlugin = require("terser-webpack-plugin");
|
|
const CssMinimizerPlugin = require("css-minimizer-webpack-plugin");
|
|
|
|
module.exports = merge(baseConfig, {
|
|
mode: 'production', // 生产模式,会开启 tree-shaking 和 压缩代码，以及其他优化
|
|
output: {
|
|
publicPath: './',
|
|
},
|
|
plugins: [
|
|
// new BundleAnalyzerPlugin(),
|
|
// 使用 CompressionPlugin 压缩静态资源
|
|
new CompressionPlugin({
|
|
algorithm: 'gzip', // 指定压缩算法
|
|
test: /\.js(\?.*)?$/i, // 正则匹配需要压缩的文件
|
|
threshold: 10240, // 对超过10k的数据进行压缩
|
|
minRatio: 0.8, // 压缩比例
|
|
deleteOriginalAssets: false, // 是否删除原文件
|
|
}),
|
|
],
|
|
optimization: {
|
|
minimize: true,
|
|
minimizer: [
|
|
new TerserPlugin({
|
|
terserOptions: {
|
|
compress: {
|
|
drop_console: process.env.NODE_ENV === 'production', // 移除所有的`console`语句
|
|
},
|
|
output: {
|
|
comments: false, // 去掉注释
|
|
},
|
|
},
|
|
extractComments: false, // 不从代码中提取注释
|
|
}),
|
|
new CssMinimizerPlugin(),
|
|
],
|
|
splitChunks: { // 分隔代码
|
|
cacheGroups: {
|
|
vendors: { // 提取node_modules 代码
|
|
test: /node_modules/, // 只匹配 node_modules 里面的模块
|
|
name: 'vendors', // 提取文件命名为 vendors.js 后缀和 chunkhash 会自动加
|
|
minChunks: 1, // 只要使用一次就提取出来
|
|
chunks: 'initial', // 只提取初始化就能获取到的模块，不管异步的
|
|
minSize: 0, // 提取代码体积大于0就提取出来
|
|
priority: 1, // 提取优先级为1
|
|
},
|
|
commons: { // 提取页面公共代码
|
|
name: 'commons', // 提取文件命名为 commons
|
|
minChunks: 2, // 只要使用两次就提取出来
|
|
chunks: 'initial', // 只提取初始化就能获取到的模块,不管异步的
|
|
minSize: 0, // 提取代码体积大于0就提取出来
|
|
}
|
|
}
|
|
},
|
|
},
|
|
}) |