const path = require('path') function resolve(dir) { return path.join(__dirname, dir) } // 导入compression-webpack-plugin const CompressionWebpackPlugin = require('compression-webpack-plugin') // 定义压缩文件类型 const productionGzipExtensions = ['js', 'css'] // 导入代码混淆插件 const UglifyJsPlugin = require('uglifyjs-webpack-plugin') module.exports = { // publicPath: '/', assetsDir: 'static', lintOnSave: true, // 生产环境是否生成 sourceMap 文件 productionSourceMap: false, // 开启 CSS source maps? css: { sourceMap: true }, // transpileDependencies: ['swiper', 'dom7', 'element-ui', 'nprogress', 'axios', 'dayjs', 'vue-i18n'], chainWebpack: config => { config.resolve.alias .set('@', resolve('src')) .set('api', resolve('src/api')) .set('utils', resolve('src/utils')) .set('components', resolve('src/components')) // 图片压缩 config.module.rule('images') .use('image-webpack-loader') .loader('image-webpack-loader') .options({ mozjpeg: { progressive: true, quality: 65 }, optipng: { enabled: false }, pngquant: { quality: '65-90', speed: 4 }, gifsicle: { interlaced: false }, webp: { quality: 75 } }) // .end() }, configureWebpack: config => { if (process.env.NODE_ENV === 'production') { // 将每个依赖包打包成单独的js文件 const plugins = [] // 生产环境 gzi压缩 plugins.push( new CompressionWebpackPlugin({ filename: '[path].gz[query]', algorithm: 'gzip', test: new RegExp('\\.(' + productionGzipExtensions.join('|') + ')$'), threshold: 10240, minRatio: 0.8 }) ) plugins.push( new UglifyJsPlugin({ uglifyOptions: { mangle: { toplevel: true }, warnings: false, compress: { drop_console: true, drop_debugger: false, pure_funcs: ['console.log'] // 移除console } }, sourceMap: false, parallel: true }) ) config.plugins = [ ...config.plugins, ...plugins ] } } // { // test: /\.js$/, // loader: 'babel-loader', // include: [ // resolve('src'), // resolve('test'), // resolve('node_modules/element-ui/src/mixins/emitter.js'),//<------add // ] // } }