Browse Source

fix: Docker 打包逻辑改进,彻底解决缓存问题 (#3473)

* feat: update nginx.conf 使用固定编译入口可能导致浏览器使用缓存js文件,而此配置可以解决

* feat: 更新docker打包逻辑: 原本固定的entry是为了方便替换环境变量,同时在nginx配置内让每次获取js等资源都不走缓存。这样的问题是首次打开会很慢。
因此本次使用的解决方案,回归vben原本的hash+timestamp的入口文件名,但是在环境变量替换的时候使用模糊匹配。
大家有类似需要可以参考环境变量的方式做 单镜像打包多环境的适配。
胤玄 1 year ago
parent
commit
dcbe5510d4
3 changed files with 8 additions and 8 deletions
  1. 2 3
      Dockerfile
  2. 2 2
      internal/vite-config/src/config/application.ts
  3. 4 3
      nginx.conf

+ 2 - 3
Dockerfile

@@ -5,7 +5,7 @@ MAINTAINER Adoin 'adoin@qq.com'
 WORKDIR /app
 COPY . ./
 # 设置 node 阿里镜像
-RUN npm config set registry https://registry.npm.taobao.org
+RUN npm config set registry https://registry.npmmirror.com
 # 设置--max-old-space-size
 ENV NODE_OPTIONS=--max-old-space-size=16384
 # 设置阿里镜像、pnpm、依赖、编译
@@ -20,7 +20,6 @@ COPY --from=build-stage /app/dist /usr/share/nginx/html/dist
 COPY --from=build-stage /app/nginx.conf /etc/nginx/nginx.conf
 EXPOSE 80
 ## 将/usr/share/nginx/html/dist/assets/index.js 和/usr/share/nginx/html/dist/_app.config.js中的"$vg_base_url"替换为环境变量中的VG_BASE_URL,$vg_sub_domain 替换成VG_SUB_DOMAIN,$vg_default_user替换成VG_DEFAULT_USER,$vg_default_password替换成VG_DEFAULT_PASSWORD 而后启动nginx
-CMD sed -i "s|__vg_base_url|$VG_BASE_URL|g" /usr/share/nginx/html/dist/assets/index.js && \
-    sed -i "s|__vg_base_url|$VG_BASE_URL|g" /usr/share/nginx/html/dist/_app.config.js && \
+CMD sed -i "s|__vg_base_url|$VG_BASE_URL|g" /usr/share/nginx/html/dist/assets/entry/index-*.js /usr/share/nginx/html/dist/_app.config.js && \
     nginx -g 'daemon off;'
 RUN echo "🎉 架 🎉 设 🎉 成 🎉 功 🎉"

+ 2 - 2
internal/vite-config/src/config/application.ts

@@ -36,7 +36,7 @@ function defineApplicationConfig(defineOptions: DefineOptions = {}) {
     });
 
     const pathResolve = (pathname: string) => resolve(root, '.', pathname);
-
+    const timestamp = new Date().getTime();
     const applicationConfig: UserConfig = {
       base: VITE_PUBLIC_PATH,
       resolve: {
@@ -64,7 +64,7 @@ function defineApplicationConfig(defineOptions: DefineOptions = {}) {
         rollupOptions: {
           output: {
             // 入口文件名
-            entryFileNames: 'assets/[name].js',
+            entryFileNames: `assets/entry/[name]-[hash]-${timestamp}.js`,
             manualChunks: {
               vue: ['vue', 'pinia', 'vue-router'],
               antd: ['ant-design-vue', '@ant-design/icons-vue'],

+ 4 - 3
nginx.conf

@@ -30,9 +30,10 @@ http {
                 add_header 'Content-Length' 0;
                 return 204;
             }
-            if ($request_filename ~* ^.*?.(html|htm|js)$) {
-              add_header Cache-Control no-cache;
-            }
+#           docker 改造之后不再需要
+#           if ($request_filename ~* ^.*?.(html|htm|js)$) {
+#             add_header Cache-Control no-cache;
+#           }
         }
     }
 }