how to force clearing cache in chrome when release new Vue app version how to force clearing cache in chrome when release new Vue app version vue.js vue.js

how to force clearing cache in chrome when release new Vue app version


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:enter image description here

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.


I had the same problem and changing (incrementing) the version number in package.json before running the build command fixed it.

For example by default the version number is set to "0.1.0"

package.json file:

{  "name": "project-name",  "version": "0.1.5",  "private": true,  ...}


You need to add a version query to your js file. This is how a browser can know if the file has changed and needs to download the new version.

So something like:

<script src="main.js?v=1.1"></script>
<script src="main.js?v=1.2"></script>

etc...