Vue项目发布后页面不更新缓存

2021-02-20 乐帮网

vuejs

在做Vuex结构的项目，修改bug在本地浏览一切都正常，发布到测试服务器上后发现不生效，经常多种方法调试最终才恍然大悟，原来我犯了一个低级的错误，大家都知道通过命令npm run build生成的发布文件在dist中其中就包含一个文件夹 static 和一个index.html文件。

由于index.html都是固定的结构，所以想着更新的时候就没有动它，只完全覆盖了static文件夹。并没有替换index.html。结果证明我错了，我们可以打开index.html看一看里面的内容：

<!DOCTYPE html><html><head><meta charset=utf-8><meta name=viewport content="width=device-width,initial-scale=1"><title>我站点的title</title><link href=/static/css/app.670637208e6d1c4f52446c5f4e688ed7.css rel=stylesheet></head><script type=text/javascript src="https://webapi.amap.com/maps?v=2.0&key=53bf26a5794ce770ca22aa72af0a1882"></script><script src=//webapi.amap.com/ui/1.1/main.js></script><body><div id=app></div><script type=text/javascript src=/static/js/manifest.5fa1fa29f3b40d8e6bd3.js></script><script type=text/javascript src=/static/js/vendor.352ee46292cd8c6bb520.js></script><script type=text/javascript src=/static/js/app.55e97083db1ed45261eb.js></script></body></html>

看到没有？就是这一串串的字符，在每一次build后就会发生变化，也就是文件名也会变。难怪我不更新index.html时看到的页面一直是旧页面。只要更新index.html就可以了。

关注我的微信公众号
在公众号里留言交流
投稿邮箱：1052839972@qq.com

庭院深深深几许？杨柳堆烟，帘幕无重数。
玉勒雕鞍游冶处，楼高不见章台路。
雨横风狂三月暮。门掩黄昏，无计留春住。
泪眼问花花不语，乱红飞过秋千去。

如果感觉对您有帮助
欢迎向作者提供捐赠
这将是创作的最大动力

Vue项目发布后页面不更新 缓存

Vue项目发布后页面不更新缓存