发布新的Vue应用程序版本时如何在Chrome中强制清除缓存 [英] how to force clearing cache in chrome when release new Vue app version

问题描述

我使用 vue-cli 创建了一个应用程序，然后构建了 dist 文件夹进行生产。

I created an app with vue-cli and then I build the dist folder for production.

该应用程序部署在具有烧瓶后端的 IIS 上，并且运行良好。

The app is deployed on IIS with flask backend and works fine.

当我必须进行一些更改并且必须重做部署时，就会出现问题。此后，用户打电话给我，因为该应用程序无法运行，但是如果我清除了Chrome缓存，该应用程序将再次正常运行。

The problem occurs when I have to make some changes and I have to redo the deployment. After this, users call me because app doesn't work but if I clear the chrome cache, the app works fine again.

如何解决此问题？发布新的应用程序版本时，有没有一种方法可以自动清除Chrome缓存？

How can I fix this problem? Is there a method to clear chrome cache automatically when I release a new application version?

谢谢

我的dist文件夹

部署：复制并粘贴文件夹dist IIS

deployment: copy and paste folder dist on IIS

如果dist文件夹中的文件正确，则可能是axios缓存出现了问题？我也对休息api进行了一些更改

if files in dist folder are correct, maybe the problem is in axios cache? i have make some changes also to rest apis

推荐答案

如果您使用 vue-cli ，则它具有用于构建 dist 的内置webpack配置。实际上，它向输出文件添加了哈希名称。
但是，如果以某种方式将其删除，则可以将其添加回webpack配置中，例如

If you use vue-cli, then it has built-in webpack configs for building dist. And in fact it adds hash-names to output files. But if it was removed somehow, you can add it back to webpack config like

  output: {
    filename: '[name].[hash].bundle.js'
  }

您的应用程序将如下所示：

And your app will looks like this:

甚至更多，您不需要处理所有这些东西将添加到html中，coz webpack会为您解决。

And even more, you do not need to handle how all this stuff will be added to html, coz webpack will figure it out for you.

这篇关于发布新的Vue应用程序版本时如何在Chrome中强制清除缓存的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！