canrd-outside / order-erp-front · Commits

Commit c659c14c5a15f3e56eeb59c9aa5862f44341c2be

Authored by 胤玄
Committed by GitHub
1 parent 5ad5c8cd

Docker dynamic publish support. (#2903) 

* feat: Docker support, including dynamic publish

* fix:  run container command
Inline Side-by-side
Showing 10 changed files with 147 additions and 15 deletions
.dockerignore 0 → 100644
  View file @c659c14
  1 +node_modules/
  2 +dist/
  3 +.vscode/
... ...
.env.docker 0 → 100644
  View file @c659c14
  1 +# Whether to open mock
  2 +VITE_USE_MOCK = false
  3 +
  4 +# public path
  5 +VITE_PUBLIC_PATH = /
  6 +
  7 +# timeout(seconds)
  8 +VITE_TIMEOUT = 15
  9 +# Delete console
  10 +VITE_DROP_CONSOLE = true
  11 +
  12 +# Whether to enable gzip or brotli compression
  13 +# Optional: gzip | brotli | none
  14 +# If you need multiple forms, you can use `,` to separate
  15 +VITE_BUILD_COMPRESS = 'none'
  16 +VITE_GLOB_API_URL="__vg_base_url"
  17 +
  18 +# File upload address， optional
  19 +# It can be forwarded by nginx or write the actual address directly
  20 +VITE_GLOB_UPLOAD_URL=/files/upload
  21 +# Interface prefix
  22 +VITE_GLOB_API_URL_PREFIX=
... ...
Dockerfile 0 → 100644
  View file @c659c14
  1 +# node 构建
  2 +FROM node:16-alpine as build-stage
  3 +# 署名
  4 +MAINTAINER Adoin 'adoin@qq.com'
  5 +WORKDIR /app
  6 +COPY . ./
  7 +# 设置 node 阿里镜像
  8 +RUN npm config set registry https://registry.npm.taobao.org
  9 +# 设置--max-old-space-size
  10 +ENV NODE_OPTIONS=--max-old-space-size=16384
  11 +# 设置阿里镜像、pnpm、依赖、编译
  12 +RUN npm install pnpm -g && \
  13 + pnpm install --frozen-lockfile && \
  14 + pnpm build:docker
  15 +# node部分结束
  16 +RUN echo "🎉 编 🎉 译 🎉 成 🎉 功 🎉"
  17 +# nginx 部署
  18 +FROM nginx:1.23.3-alpine as production-stage
  19 +COPY --from=build-stage /app/dist /usr/share/nginx/html/dist
  20 +COPY --from=build-stage /app/nginx.conf /etc/nginx/nginx.conf
  21 +EXPOSE 80
  22 +## 将/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
  23 +CMD sed -i "s|__vg_base_url|$VG_BASE_URL|g" /usr/share/nginx/html/dist/assets/index.js && \
  24 + sed -i "s|__vg_base_url|$VG_BASE_URL|g" /usr/share/nginx/html/dist/_app.config.js && \
  25 + nginx -g 'daemon off;'
  26 +RUN echo "🎉 架 🎉 设 🎉 成 🎉 功 🎉"
... ...
README.md
  View file @c659c14
... ... @@ -86,6 +86,24 @@ pnpm serve
86 86 pnpm build
87 87 ```
88 88  
  89 +- docker
  90 +
  91 +### The dockerFile is located in the project root directory and supports differential deployment
  92 +
  93 +#### build image
  94 +
  95 +```bash
  96 +docker build -t vue-vben-admin .
  97 +```
  98 +
  99 +#### Environment variables are dynamically used to achieve differentiated container deployment. Different VG_BASE_URL environment variables point to different back-end service addresses. In the following example, http://localhost:3333 is used as the back-end service address and the container is mapped to port 6666
  100 +
  101 +```bash
  102 +docker run --name vue-vben-admin -d -p 6666:80 -e VG_BASE_URL=http://localhost:3333 vue-vben-admin
  103 +```
  104 +
  105 +Then you can navigate http://localhost:6666
  106 +
89 107 ## Change Log
90 108  
91 109 [CHANGELOG](./CHANGELOG.zh_CN.md)
... ...
README.zh-CN.md
  View file @c659c14
... ... @@ -86,6 +86,24 @@ pnpm serve
86 86 pnpm build
87 87 ```
88 88  
  89 +- docker
  90 +
  91 +### dockerFile 位于项目根目录下 并且支持差异化部署
  92 +
  93 +#### 构建镜像
  94 +
  95 +```bash
  96 +docker build -t vue-vben-admin .
  97 +```
  98 +
  99 +#### 动态使用环境变量实现容器差异化部署,通过不同的 VG_BASE_URL 环境变量，指向不同的后端服务地址，下面例子使用 http://localhost:3333 作为后端服务地址，并且将容器映射到 6666 端口
  100 +
  101 +```bash
  102 +docker run --name vue-vben-admin -d -p 6666:80 -e VG_BASE_URL=http://localhost:3333 vue-vben-admin
  103 +```
  104 +
  105 +而后可以打开 http://localhost:6666 访问
  106 +
89 107 ## 更新日志
90 108  
91 109 [CHANGELOG](./CHANGELOG.zh_CN.md)
... ...
internal/vite-config/src/config/application.ts
  View file @c659c14
... ... @@ -69,6 +69,8 @@ function defineApplicationConfig(defineOptions: DefineOptions = {}) {
69 69 cssTarget: 'chrome80',
70 70 rollupOptions: {
71 71 output: {
  72 + // 入口文件名
  73 + entryFileNames: 'assets/[name].js',
72 74 manualChunks: {
73 75 vue: ['vue', 'pinia', 'vue-router'],
74 76 antd: ['ant-design-vue', '@ant-design/icons-vue'],
... ...
internal/vite-config/src/plugins/index.ts
  View file @c659c14
... ... @@ -4,6 +4,7 @@ import vueJsx from '@vitejs/plugin-vue-jsx';
4 4 import DefineOptions from 'unplugin-vue-define-options/vite';
5 5 import { type PluginOption } from 'vite';
6 6 import purgeIcons from 'vite-plugin-purge-icons';
  7 +import vueSetupExtend from 'vite-plugin-vue-setup-extend';
7 8  
8 9 import { createAppConfigPlugin } from './appConfig';
9 10 import { configCompressPlugin } from './compress';
... ... @@ -11,7 +12,7 @@ import { configHtmlPlugin } from './html';
11 12 import { configMockPlugin } from './mock';
12 13 import { configSvgIconsPlugin } from './svgSprite';
13 14 import { configVisualizerConfig } from './visualizer';
14   -import vueSetupExtend from 'vite-plugin-vue-setup-extend';
  15 +
15 16 interface Options {
16 17 isBuild: boolean;
17 18 root: string;
... ...
nginx.conf 0 → 100644
  View file @c659c14
  1 +#user nobody;
  2 +worker_processes 1;
  3 +
  4 +#error_log logs/error.log;
  5 +#error_log logs/error.log notice;
  6 +#error_log logs/error.log info;
  7 +
  8 +#pid logs/nginx.pid;
  9 +
  10 +
  11 +events {
  12 + worker_connections 1024;
  13 +}
  14 +
  15 +
  16 +http {
  17 + include mime.types;
  18 + default_type application/octet-stream;
  19 + server {
  20 + listen 80;
  21 + location / {
  22 + root /usr/share/nginx/html/dist;
  23 + try_files $uri $uri/ /index.html;
  24 + index index.html;
  25 + # Enable CORS
  26 + add_header 'Access-Control-Allow-Origin' '*';
  27 + add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';
  28 + add_header 'Access-Control-Allow-Headers' 'DNT,X-CustomHeader,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type';
  29 + if ($request_method = 'OPTIONS') {
  30 + add_header 'Access-Control-Max-Age' 1728000;
  31 + add_header 'Content-Type' 'text/plain charset=UTF-8';
  32 + add_header 'Content-Length' 0;
  33 + return 204;
  34 + }
  35 + }
  36 +}
  37 +}
... ...
package.json
  View file @c659c14
... ... @@ -19,6 +19,7 @@
19 19 "bootstrap": "pnpm install",
20 20 "build": "cross-env NODE_ENV=production NODE_OPTIONS=--max-old-space-size=8192 pnpm vite build",
21 21 "build:analyze": "cross-env NODE_OPTIONS=--max-old-space-size=8192 pnpm vite build --mode analyze",
  22 + "build:docker": "vite build --mode docker",
22 23 "build:no-cache": "pnpm clean:cache && npm run build",
23 24 "build:test": "cross-env NODE_OPTIONS=--max-old-space-size=8192 pnpm vite build --mode test",
24 25 "commit": "czg",
... ... @@ -103,7 +104,7 @@
103 104 "vue-router": "^4.1.6",
104 105 "vue-types": "^5.0.2",
105 106 "vuedraggable": "^4.1.0",
106   - "vxe-table": "^4.3.11",
  107 + "vxe-table": "^4.4.5",
107 108 "vxe-table-plugin-export-xlsx": "^3.0.4",
108 109 "xe-utils": "^3.5.7",
109 110 "xlsx": "^0.18.5"
... ...
pnpm-lock.yaml
  View file @c659c14
1 1 lockfileVersion: '6.0'
2 2  
  3 +settings:
  4 + autoInstallPeers: true
  5 + excludeLinksFromLockfile: false
  6 +
3 7 importers:
4 8  
5 9 .:
... ... @@ -97,9 +101,6 @@ importers:
97 101 vditor:
98 102 specifier: ^3.9.1
99 103 version: 3.9.1
100   - vite-plugin-vue-setup-extend:
101   - specifier: ^0.4.0
102   - version: 0.4.0(vite@4.3.0-beta.2)
103 104 vue:
104 105 specifier: ^3.2.47
105 106 version: 3.2.47
... ... @@ -119,11 +120,11 @@ importers:
119 120 specifier: ^4.1.0
120 121 version: 4.1.0(vue@3.2.47)
121 122 vxe-table:
122   - specifier: ^4.3.11
123   - version: 4.3.11(vue@3.2.47)(xe-utils@3.5.7)
  123 + specifier: ^4.4.5
  124 + version: 4.4.5(vue@3.2.47)(xe-utils@3.5.7)
124 125 vxe-table-plugin-export-xlsx:
125 126 specifier: ^3.0.4
126   - version: 3.0.4(vxe-table@4.3.11)
  127 + version: 3.0.4(vxe-table@4.4.5)
127 128 xe-utils:
128 129 specifier: ^3.5.7
129 130 version: 3.5.7
... ... @@ -236,6 +237,9 @@ importers:
236 237 vite-plugin-mock:
237 238 specifier: ^2.9.6
238 239 version: 2.9.6(mockjs@1.1.0)(rollup@2.79.1)(vite@4.3.0-beta.2)
  240 + vite-plugin-vue-setup-extend:
  241 + specifier: ^0.4.0
  242 + version: 0.4.0(vite@4.3.0-beta.2)
239 243 vue-tsc:
240 244 specifier: ^1.2.0
241 245 version: 1.2.0(typescript@5.0.3)
... ... @@ -2436,7 +2440,7 @@ packages:
2436 2440 dependencies:
2437 2441 '@volar/language-core': 1.3.0-alpha.0
2438 2442 '@volar/source-map': 1.3.0-alpha.0
2439   - '@vue/compiler-dom': 3.2.47
  2443 + '@vue/compiler-dom': 3.3.4
2440 2444 '@vue/compiler-sfc': 3.2.47
2441 2445 '@vue/reactivity': 3.2.47
2442 2446 '@vue/shared': 3.2.47
... ... @@ -2622,7 +2626,7 @@ packages:
2622 2626 js-beautify: 1.14.6
2623 2627 vue: 3.2.47
2624 2628 optionalDependencies:
2625   - '@vue/compiler-dom': 3.2.47
  2629 + '@vue/compiler-dom': 3.3.4
2626 2630 '@vue/server-renderer': 3.2.47(vue@3.2.47)
2627 2631 dev: true
2628 2632  
... ... @@ -9673,7 +9677,7 @@ packages:
9673 9677 '@vue/compiler-sfc': 3.2.47
9674 9678 magic-string: 0.25.9
9675 9679 vite: 4.3.0-beta.2(@types/node@18.15.11)(less@4.1.3)(sass@1.60.0)
9676   - dev: false
  9680 + dev: true
9677 9681  
9678 9682 /vite@4.3.0-beta.2(@types/node@18.15.11)(less@4.1.3)(sass@1.60.0):
9679 9683 resolution: {integrity: sha512-RRghM7RiRnwknCG3hS+NE8C+N3CNX4yKfVhFxO3NqrtYErN6htac//De9IwIHWqgV8DdKoNPeK8Yb/FOlZvjoQ==}
... ... @@ -9851,16 +9855,16 @@ packages:
9851 9855 vue: 3.2.47
9852 9856 dev: false
9853 9857  
9854   - /vxe-table-plugin-export-xlsx@3.0.4(vxe-table@4.3.11):
  9858 + /vxe-table-plugin-export-xlsx@3.0.4(vxe-table@4.4.5):
9855 9859 resolution: {integrity: sha512-Og/NbXRIb+BS6sJ48oDNVrZnlkcpaCd/zS8JBAZjHLgioWr1Xoob6FEpaeXBebGPPgTumZNUrrBO57JhhYAerA==}
9856 9860 peerDependencies:
9857 9861 vxe-table: ^4.0.27
9858 9862 dependencies:
9859   - vxe-table: 4.3.11(vue@3.2.47)(xe-utils@3.5.7)
  9863 + vxe-table: 4.4.5(vue@3.2.47)(xe-utils@3.5.7)
9860 9864 dev: false
9861 9865  
9862   - /vxe-table@4.3.11(vue@3.2.47)(xe-utils@3.5.7):
9863   - resolution: {integrity: sha512-n2OXuUaKurVxxhRz0b1DojLdvtYwKkidRAqI9oGDw2IQ0y2IPs2Oq+lX2V6ar3glFdjjkS3BqnDBAk0elt6e0Q==}
  9866 + /vxe-table@4.4.5(vue@3.2.47)(xe-utils@3.5.7):
  9867 + resolution: {integrity: sha512-5huB/p0pVgFZjH/abLkWBFnBFe/9mozdQmbXehiGZJHQ6KfzLEsqpKbPsKAnMYEhezPmH4igdhYkXxb7ohWbTA==}
9864 9868 peerDependencies:
9865 9869 vue: ^3.2.28
9866 9870 xe-utils: ^3.5.0
... ...