github_mirrors/vue-vben-admin
1
0
Fork 0
mirror of https://github.com/vbenjs/vue-vben-admin.git synced 2025-02-02 18:28:40 +08:00
Code Issues Actions 4 Packages Projects Releases Wiki Activity

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

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

* feat: 更新docker打包逻辑： 原本固定的entry是为了方便替换环境变量，同时在nginx配置内让每次获取js等资源都不走缓存。这样的问题是首次打开会很慢。
因此本次使用的解决方案，回归vben原本的hash+timestamp的入口文件名，但是在环境变量替换的时候使用模糊匹配。
大家有类似需要可以参考环境变量的方式做 单镜像打包多环境的适配。
This commit is contained in:
胤玄 2023-12-27 14:28:37 +08:00 committed by GitHub
parent 3de22b44b1
commit dcbe5510d4
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 8 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
Dockerfile
View File

@ -5,7 +5,7 @@ MAINTAINER Adoin 'adoin@qq.com'
WORKDIR /app WORKDIR /app
COPY . ./ COPY . ./
# 设置 node 阿里镜像 # 设置 node 阿里镜像
RUN npm config set registry https://registry.npm.taobao.org RUN npm config set registry https://registry.npmmirror.com
# 设置--max-old-space-size # 设置--max-old-space-size
ENV NODE_OPTIONS=--max-old-space-size=16384 ENV NODE_OPTIONS=--max-old-space-size=16384
# 设置阿里镜像、pnpm、依赖、编译 # 设置阿里镜像、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 COPY --from=build-stage /app/nginx.conf /etc/nginx/nginx.conf
EXPOSE 80 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 ## 将/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 && \ 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 && \
sed -i "s|__vg_base_url|$VG_BASE_URL|g" /usr/share/nginx/html/dist/_app.config.js && \
nginx -g 'daemon off;' nginx -g 'daemon off;'
RUN echo "🎉 架 🎉 设 🎉 成 🎉 功 🎉" RUN echo "🎉 架 🎉 设 🎉 成 🎉 功 🎉"

4
internal/vite-config/src/config/application.ts
View File

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

7
nginx.conf
View File

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