我的项目没做完,没进行打包,直接装插件配置
npm install --save-dev compression-webpack-plugin
然后配置vue.config.js配置文件
const path = require('path');
const webpack = require('webpack')
const CompressionWebpackPlugin = require('compression-webpack-plugin')
const productionGzipExtensions = ['js', 'css']
const isProduction = process.env.NODE_ENV === 'production'
module.exports = {
lintOnSave: false,
runtimeCompiler: true,
publicPath: './', // 设置打包文件相对路径
// 这是前端解决跨域的代码
devServer: {
port: 8080,
open: true,
proxy: {
'/api': {
target: 'http://xxx',//接口地址
changeOrigin: true,
pathRewrite: {
// 路径重写
'^/api': ''
}
}
}
},
configureWebpack:{
resolve:{
alias:{
'@':path.resolve(__dirname, './src'),
'@i':path.resolve(__dirname, './src/assets'),
}
},
plugins: [
new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/),
// 下面是下载的插件的配置
new CompressionWebpackPlugin({
algorithm: 'gzip',
test: new RegExp('\\.(' + productionGzipExtensions.join('|') + ')$'),
threshold: 10240,
minRatio: 0.8
}),
new webpack.optimize.LimitChunkCountPlugin({
maxChunks: 5,
minChunkSize: 100
})
]
}
}
如果报错TypeError: Cannot read property ‘tapPromise‘ of undefined
则是版本问题
先执行卸载命令->npm uninstall compression-webpack-plugin
执行安装命令->npm i compression-webpack-plugin@5.0.1