I apply lazy loading and code splitting in my vue app
But somehow when I update my code and I deploy it to production only some chunks are updated with a new hash.
File Size Gzipped
dist/js/chunk-vendors.8bacd999.js 1379.15 KiB 418.03 KiB
dist/js/super-user.55f6d84e.js 230.82 KiB 43.40 KiB
dist/js/user.75857fc3.js 141.31 KiB 28.63 KiB
dist/js/worker.3f845d96.js 116.95 KiB 27.14 KiB
dist/js/super-user~user~worker.89497bd 95.72 KiB 26.28 KiB
4.js
dist/js/super-user~worker.de7f3513.js 41.93 KiB 14.24 KiB
dist/js/app.d05288d8.js 33.93 KiB 9.72 KiB
dist/js/landing-page.abe82391.js 28.14 KiB 10.78 KiB
dist/precache-manifest.9e6d4f8b3b203e5 6.23 KiB 1.84 KiB
a7409c4e5738c04b0.js
dist/service-worker.js 1.04 KiB 0.61 KiB
dist/css/chunk-vendors.c380a352.css 354.50 KiB 40.53 KiB
dist/css/super-user~user~worker.b6103c 30.99 KiB 4.90 KiB
9d.css
dist/css/user.efb5b1bf.css 24.94 KiB 4.66 KiB
dist/css/super-user.78d831e9.css 17.71 KiB 3.26 KiB
dist/css/super-user~worker.3a0fff16.cs 12.84 KiB 1.87 KiB
s
dist/css/landing-page.de5bd5da.css 7.32 KiB 1.77 KiB
dist/css/worker.7dcd23eb.css 5.72 KiB 1.63 KiB
dist/css/app.3e078b33.css 3.55 KiB 1.16 KiB
VS
File Size Gzipped
dist/js/chunk-vendors.8bacd999.js 1379.15 KiB 418.03 KiB
dist/js/super-user.0cf42025.js 233.18 KiB 43.64 KiB
dist/js/user.75857fc3.js 141.31 KiB 28.63 KiB
dist/js/worker.3f845d96.js 116.95 KiB 27.14 KiB
dist/js/super-user~user~worker.89497bd 95.72 KiB 26.28 KiB
4.js
dist/js/super-user~worker.de7f3513.js 41.93 KiB 14.24 KiB
dist/js/app.68802416.js 33.93 KiB 9.72 KiB
dist/js/landing-page.abe82391.js 28.14 KiB 10.78 KiB
dist/precache-manifest.5d1728ab9e82dbe 6.23 KiB 1.84 KiB
f01c617532cf35342.js
dist/service-worker.js 1.04 KiB 0.61 KiB
dist/css/chunk-vendors.c380a352.css 354.50 KiB 40.53 KiB
dist/css/super-user~user~worker.b6103c 30.99 KiB 4.90 KiB
9d.css
dist/css/user.efb5b1bf.css 24.94 KiB 4.66 KiB
dist/css/super-user.822e51f6.css 17.71 KiB 3.26 KiB
dist/css/super-user~worker.3a0fff16.cs 12.84 KiB 1.87 KiB
s
dist/css/landing-page.de5bd5da.css 7.32 KiB 1.77 KiB
dist/css/worker.7dcd23eb.css 5.72 KiB 1.63 KiB
dist/css/app.3e078b33.css 3.55 KiB 1.16 KiB
I've updated a view, we will call it Feature.vue, and is defined as
const Feature = () =>
import(/* webpackChunkName: "user" */ "./views/Feature.vue");
But in the build the hash of the user modules are not updated, this causes to a lot of users see old versions of my app and need to go to the landing page and make a refresh to refresh the app, if they refresh the page on feature they can see changes, but the next time they access to feature the cache will show the old version.
Also to be more specific my changes are some js changes, then at least the js file needs to change the hash there is a way to force change hash of all files every update?.