vue打包之后文件名类型于“chunk-vendors.12492877.js”这样
这种情况下,上线的时候除非把原来的文件都删除掉,否则文件会一直增加,这样会增大存储压力,将文件名固定就不会出现这种问题,将文件命名改为chunk-vendors.js?v=12492877将完美解决。
// const CompressionPlugin = require('compression-webpack-plugin');
const { defineConfig } = require('@vue/cli-service')
const Timestamp = new Date().getTime();
module.exports = defineConfig({
devServer:{
port:8080,
allowedHosts: "all",//跨域
webSocketServer:false,
proxy:{//代理
"/":{
target:"http://test-xx.cn/ ",
changeOrigin:true,
pathRewrite:{
"^/":"/"
}
}
}
},
transpileDependencies: true,
publicPath: './',
// 输出文件目录
assetsDir: 'static',
outputDir: process.env.outputDir,
// eslint-loader 是否在保存的时候检查
lintOnSave: true,
// 生产环境是否生成 sourceMap 文件
productionSourceMap: false,
//filenameHashing: false,
css: {
extract: {
// 修改打包后css文件名
filename: `static/css/[name].css?v=[contenthash:8]`,
chunkFilename: `static/css/[name].css?v=[contenthash:8]`,
ignoreOrder: true,
}
},
configureWebpack: {
output: { // 输出重构 打包编译后的 文件名称 【模块名称.版本号.时间戳】
// filename: utils.assetsPath('js/[name].[chunkhash].'+Version+'js'),
// chunkFilename: utils.assetsPath('js/[id].[chunkhash].'+Version+'js')
filename: `static/js/[name].js?v=[contenthash:8]`, // js打包文件,添加时间戳
chunkFilename: `static/js/[name].js?v=[contenthash:8]`
}
},
chainWebpack: config => {
//if (process.env.NODE_ENV === 'production') {
// 给js配置版本号
// config.output.filename('static/js/[name].js?v=[contenthash:8]').end();
// config.output.chunkFilename('static/js/[name].js?v=[contenthash:8]').end();
// 给图片配置版本号
config.module.rule('images').test(/\.(png|jpe?g|gif|svg)(\?.*)?$/)
.use('url-loader')
.loader('url-loader')
.options( {
name:`[path][name].[ext]?v=${Timestamp}`, // 利用[path]路径获取文件夹名称并设置文件名
fallback: 'file-loader', // 当超过8192byte时,会回退使用file-loader
}).end();
//}
},
})