vue-cli4.0 项目发布浏览器缓存问题

每次vue项目部署之后，新增的需求和改的bug都不起作用，每次都需要清理一下浏览器缓存才能使用

用户体验感太差

1. 修改请求头
2. 修改服务器ng配置
3. webpack打包时添加时间戳

1.在入口文件index.html添加

  <!-- 处理浏览器缓存 -->
    <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">

在Chrome中，设置Cache-Control为no-store，可以防止页面被放在cache中，这样可以直接去请求服务器，但是Cache-Control为no-cache，对Chrome不能起到作用，但是对于IE浏览器而言，设置Cache-Control为no-store和no-cache均可以发挥作用，同时对于搜狗和Firefox浏览器而言，将Cache-Control为no-store均可以达到不设置缓存的目的，一定要注意

2.在ng/conf/nginx.conf配置文件，让index.html不再缓存，记得重启ng

	location = /index.html {
	     add_header Cache-Control "no-cache, no-store";
    }

3.webpack配置，让js。css文件携带时间戳

const path = require(“path”); // 获取当前的时间戳
let timeStamp = new Date().getTime();
module.exports = {
	filenameHashing:false, // 打包的时候不使用hash值.因为我们有时间戳来确定项目的唯一性了.
   // 
   configureWebpack: {    //重点
	    output: { // 输出重构 打包编译后的js文件名称,添加时间戳.
             filename: `js[name].${ timeStamp }.js`,
               chunkFilename: `js[name].${ timeStamp }.js`,
		}
	},
	css: { //重点.
		extract:{ // 打包后css文件名称添加时间戳
		 	filename:`css/[name].${ timeStamp }.css`,
		 	chunkFilename:`css/[name].${ timeStamp }.css`,
		}
	}
};