|
|
|
const { DefinePlugin } = require('webpack');
|
|
|
|
const TerserPlugin = require('terser-webpack-plugin');
|
|
|
|
const CssMinimizerPlugin = require('css-minimizer-webpack-plugin');
|
|
|
|
const CompressionWebpackPlugin = require('compression-webpack-plugin');
|
|
|
|
const { BundleAnalyzerPlugin } = require('webpack-bundle-analyzer');
|
|
|
|
|
|
|
|
module.exports = {
|
|
|
|
devServer: {
|
|
|
|
proxy: {
|
|
|
|
'/api': {
|
|
|
|
target: 'http://192.168.10.54:9100/v1',
|
|
|
|
changeOrigin: true,
|
|
|
|
pathRewrite: {
|
|
|
|
'^/api': '',
|
|
|
|
},
|
|
|
|
},
|
|
|
|
},
|
|
|
|
},
|
|
|
|
configureWebpack: {
|
|
|
|
optimization: {
|
|
|
|
minimizer: [
|
|
|
|
new TerserPlugin({
|
|
|
|
terserOptions: {
|
|
|
|
compress: {
|
|
|
|
drop_console: true, // 删除 console
|
|
|
|
},
|
|
|
|
},
|
|
|
|
}),
|
|
|
|
new CssMinimizerPlugin(),
|
|
|
|
],
|
|
|
|
splitChunks: {
|
|
|
|
chunks: 'all',
|
|
|
|
maxInitialRequests: Infinity,
|
|
|
|
minSize: 20000, // 生成块的最小大小
|
|
|
|
maxSize: 500000, // 生成块的最大大小
|
|
|
|
cacheGroups: {
|
|
|
|
vendors: {
|
|
|
|
test: /[\\/]node_modules[\\/]/,
|
|
|
|
name(module) {
|
|
|
|
const packageName = module.context.match(
|
|
|
|
/[\\/]node_modules[\\/](.*?)([\\/]|$)/
|
|
|
|
)[1];
|
|
|
|
return `npm.${packageName.replace('@', '')}`;
|
|
|
|
},
|
|
|
|
},
|
|
|
|
},
|
|
|
|
},
|
|
|
|
runtimeChunk: 'single',
|
|
|
|
},
|
|
|
|
plugins: [
|
|
|
|
new CompressionWebpackPlugin({
|
|
|
|
test: /\.(js|css|html|svg)$/, // 需要压缩的文件类型
|
|
|
|
threshold: 10240, // 资源超过10KB时压缩
|
|
|
|
deleteOriginalAssets: false, // 是否删除原始文件
|
|
|
|
}),
|
|
|
|
new BundleAnalyzerPlugin({
|
|
|
|
analyzerMode: 'static', // 生成静态报告文件
|
|
|
|
openAnalyzer: false, // 打包后是否自动打开报告
|
|
|
|
}),
|
|
|
|
],
|
|
|
|
},
|
|
|
|
chainWebpack: config => {
|
|
|
|
// config.plugin('define').use(DefinePlugin, [
|
|
|
|
// {
|
|
|
|
// 'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV),
|
|
|
|
// },
|
|
|
|
// ]);
|
|
|
|
|
|
|
|
// config.module
|
|
|
|
// .rule('images')
|
|
|
|
// .use('url-loader')
|
|
|
|
// .loader('url-loader')
|
|
|
|
// .tap(options => ({
|
|
|
|
// limit: 8192, // 图片小于8KB时转换为base64
|
|
|
|
// fallback: {
|
|
|
|
// loader: 'file-loader',
|
|
|
|
// options: {
|
|
|
|
// name: 'img/[name].[hash:8].[ext]',
|
|
|
|
// },
|
|
|
|
// },
|
|
|
|
// }));
|
|
|
|
},
|
|
|
|
};
|