项目上线后，针对使用频繁的功能模块，比如请假，加班的新增以及编辑内容涉及到数据逻辑的处理的时候，你会发现浏览器缓存的问题非常的严峻，总不能一直告诉用户要清理缓存吧，这个时候前台开发人员就需要即使做优化，一个通常的处理的办法就通过时间戳解决。index.html文件在服务器端可能被缓存，css，js同样如此，以下是一种解决方案
第一步在修改public文件夹内index.html的内容
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<meta http-equiv="pragram" content="no-cache">
<meta http-equiv="cache-control" content="no-cache, no-store, must-revalidate">
<meta http-equiv="expires" content="0">
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
</head>第二步，修改vue.config.js文件
注意css配置项跟configureWebpack是并列关系
configureWebpack: {
output: { // 输出重构 打包编译后的js文件名称,添加时间戳.
filename: `js/js[name].${timeStamp}.js`,
chunkFilename: `js/chunk.[id].${timeStamp}.js`
},
// 关闭 webpack 的性能提示
performance: {
hints: false
},
name: name,
resolve: {
alias: {
'@': resolve('src')
}
}
},
css: { // 重点.
extract: { // 打包后css文件名称添加时间戳
filename: `css/[name].${timeStamp}.css`,
chunkFilename: `css/chunk.[id].${timeStamp}.css`
}
},第三步：修改nginx（nginx.conf中配置）中配置不缓存index文件的内容
if ($request_filename ~* ^.*?.(html|htm)$) {
add_header Cache-Control "private, no-store, no-cache, must-revalidate, proxy-revalidate";
} 
配置就完毕了，重新打包部署服务器即可。