diff --git a/deploy/nginx-sb-front.conf b/deploy/nginx-sb-front.conf index bf7a6a1..7329130 100644 --- a/deploy/nginx-sb-front.conf +++ b/deploy/nginx-sb-front.conf @@ -11,7 +11,14 @@ server { try_files $uri $uri/ /index.html; } - # 해시 자산 장기 캐시 + # index.html 은 캐시 금지 — 배포로 청크 해시가 바뀌어도 항상 최신 진입점을 받도록. + # (캐시되면 옛 index.html 이 삭제된 옛 청크를 불러 메뉴가 안 열리는 문제 발생) + location = /index.html { + add_header Cache-Control "no-cache, no-store, must-revalidate"; + expires -1; + } + + # 해시 자산 장기 캐시 (파일명에 해시가 있어 immutable 안전) location /assets/ { expires 1y; add_header Cache-Control "public, immutable"; diff --git a/src/router/index.js b/src/router/index.js index d77ca18..d0ac091 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -107,4 +107,16 @@ router.beforeEach((to, from) => { } }) +// 새 배포로 청크 해시가 바뀐 뒤, 캐시된 옛 index.html 이 삭제된 옛 청크를 부르면 +// 동적 import 가 실패한다. 이 경우 목적지로 전체 새로고침해 최신 index.html 을 받게 한다. +let reloadingForChunk = false +router.onError((err, to) => { + const msg = (err && err.message) || '' + const chunkError = /dynamically imported module|Importing a module script failed|Failed to fetch dynamically imported module|ChunkLoadError|error loading dynamically imported module/i.test(msg) + if (chunkError && !reloadingForChunk) { + reloadingForChunk = true + window.location.assign(to?.fullPath || window.location.pathname) + } +}) + export default router