feat: 添加 preview 环境配置及 CI、版本号 tip、依赖升级

.env.preview

+# Whether to open mock
+VITE_USE_MOCK = true
+
+# public path
+VITE_PUBLIC_PATH = /
+
+# Delete console
+VITE_DROP_CONSOLE = true
+
+# Whether to enable gzip or brotli compression
+# Optional: gzip | brotli | none
+# If you need multiple forms, you can use `,` to separate
+VITE_BUILD_COMPRESS = 'gzip'
+
+# Whether to delete origin files when using compress, default false
+VITE_BUILD_COMPRESS_DELETE_ORIGIN_FILE = false
+
+# Basic interface address SPA
+# VITE_GLOB_API_URL=/basic-api
+VITE_GLOB_API_URL=http://192.168.0.156:17181
+
+# Interface prefix
+# VITE_GLOB_API_URL_PREFIX=
+VITE_GLOB_API_URL_PREFIX=/api
+
+# File upload address， optional
+# It can be forwarded by nginx or write the actual address directly
+VITE_GLOB_UPLOAD_URL=/upload
+
+# Whether to enable image compression
+VITE_USE_IMAGEMIN= true
+
+# use pwa
+VITE_USE_PWA = false
+
+# Is it compatible with older browsers
+VITE_LEGACY = false

.gitlab-ci.yml

@@ -5,7 +5,8 @@ variables:
   # 容器名称
   CONTAINER_NAME: basic-vue-admin
   # 对外访问端口
-  EXPOSE_PORT: 18000
+  BETA_EXPOSE_PORT: 18000
+  PREIVEW_EXPOSE_PORT: 17000
 
 # Pipelines 步骤
 stages:
@@ -31,7 +32,8 @@ build-job:
     - YR-CI
   script:
     - pnpm i
-    - pnpm build
+    - if [ "$CI_BUILD_REF_NAME" == "beta" ]; then NPM_SCRIPT="build:test"; else if ["$CI_BUILD_REF_NAME" == "preview"]; then NPM_SCRIPT="build:preview"; else NPM_SCRIPT="build"; fi
+    - pnpm ${NPM_SCRIPT}
   artifacts:
     # 配置构建结果过期时间
     expire_in: 1 day
@@ -48,6 +50,7 @@ deploy-job:
     - build-job
   only:
     - beta
+    - preview
   # 使用 CD Runner，在 GitLab-Runner 中注册好的 Runner（此处配置成使用宿主环境构建）
   tags:
     - YR-CD
@@ -57,7 +60,8 @@ deploy-job:
     # 尝试删除上一个容器
     - id=$(docker ps -aqf name=$CONTAINER_NAME) && [ "$id" ] && docker rm -f $id || true
     # 在本地运行构建好的镜像
-    - docker run -d --name $CONTAINER_NAME -p $EXPOSE_PORT:80 $TAG
+    - if [ "$CI_BUILD_REF_NAME" == "beta" ]; then PORT=$PREIVEW_EXPOSE_PORT; else PORT=$BETA_EXPOSE_PORT; fi
+    - docker run -d --name $CONTAINER_NAME -p ${PORT}:80 $TAG
   variables:
     # 设置镜像 tag，使用 git tag 标识作为镜像 tag
     TAG: $REGISTRY_REMOTE/basic/$CONTAINER_NAME:$CI_BUILD_REF_NAME

build/vite/plugin/autoImport.ts

@@ -14,9 +14,9 @@ export function configAutoImportPlugin(): Plugin {
             'vue',
             'vue-router',
             {
-                '/@/config/app': ['$app'],
-                '/@/api/services': ['defs'],
-                '/@/api/services/mods': ['API'],
+                '@/config/app': ['$app'],
+                '@/api/services': ['defs'],
+                '@/api/services/mods': ['API'],
             },
         ],
     })

package.json

@@ -26,6 +26,7 @@
         "dev": "vite",
         "build": "cross-env NODE_ENV=production vite build && esno ./build/script/postBuild.ts",
         "build:test": "cross-env vite build --mode test && esno ./build/script/postBuild.ts",
+        "build:preview": "cross-env vite build --mode preview && esno ./build/script/postBuild.ts",
         "build:no-cache": "pnpm clean:cache && npm run build",
         "report": "cross-env REPORT=true npm run build",
         "type:check": "vue-tsc --noEmit --skipLibCheck",
@@ -55,28 +56,28 @@
         "@ant-design/colors": "^6.0.0",
         "@ant-design/icons-vue": "^6.1.0",
         "@iconify/iconify": "^2.2.1",
-        "@logicflow/core": "^1.1.21",
-        "@logicflow/extension": "^1.1.21",
+        "@logicflow/core": "^1.1.22",
+        "@logicflow/extension": "^1.1.22",
         "@vue/runtime-core": "^3.2.37",
         "@vue/shared": "^3.2.37",
-        "@vueuse/core": "^8.7.5",
-        "@vueuse/shared": "^8.7.5",
-        "@zxcvbn-ts/core": "^2.0.1",
-        "ant-design-vue": "^3.2.9",
+        "@vueuse/core": "^8.9.4",
+        "@vueuse/shared": "^8.9.4",
+        "@zxcvbn-ts/core": "^2.0.3",
+        "ant-design-vue": "^3.2.10",
         "axios": "^0.26.1",
-        "codemirror": "^5.65.6",
+        "codemirror": "^5.65.7",
         "cropperjs": "^1.5.12",
         "crypto-js": "^4.1.1",
-        "dayjs": "^1.11.3",
+        "dayjs": "^1.11.4",
         "echarts": "^5.3.3",
         "intro.js": "^5.1.0",
         "lodash-es": "^4.17.21",
         "mockjs": "^1.1.0",
         "nprogress": "^0.2.0",
         "path-to-regexp": "^6.2.1",
-        "pinia": "^2.0.14",
+        "pinia": "^2.0.17",
         "print-js": "^1.6.0",
-        "qrcode": "^1.5.0",
+        "qrcode": "^1.5.1",
         "qs": "^6.11.0",
         "resize-observer-polyfill": "^1.5.1",
         "showdown": "^2.1.0",
@@ -84,16 +85,16 @@
         "tinymce": "^5.10.5",
         "vditor": "^3.8.15",
         "vue": "^3.2.37",
-        "vue-i18n": "^9.1.10",
+        "vue-i18n": "^9.2.0",
         "vue-json-pretty": "^2.1.1",
-        "vue-router": "^4.0.16",
-        "vue-types": "^4.1.1",
+        "vue-router": "^4.1.3",
+        "vue-types": "^4.2.1",
         "xlsx": "^0.18.5"
     },
     "devDependencies": {
         "@commitlint/cli": "^17.0.3",
         "@commitlint/config-conventional": "^17.0.3",
-        "@iconify/json": "^2.1.72",
+        "@iconify/json": "^2.1.86",
         "@purge-icons/generated": "^0.8.1",
         "@types/codemirror": "^5.60.5",
         "@types/crypto-js": "^4.1.1",
@@ -102,29 +103,29 @@
         "@types/intro.js": "^3.0.2",
         "@types/lodash-es": "^4.17.6",
         "@types/mockjs": "^1.0.6",
-        "@types/node": "^18.0.1",
+        "@types/node": "^18.6.3",
         "@types/nprogress": "^0.2.0",
         "@types/qrcode": "^1.4.2",
         "@types/qs": "^6.9.7",
         "@types/showdown": "^1.9.4",
         "@types/sortablejs": "^1.13.0",
-        "@typescript-eslint/eslint-plugin": "^5.30.4",
-        "@typescript-eslint/parser": "^5.30.4",
-        "@vitejs/plugin-legacy": "^1.8.2",
-        "@vitejs/plugin-vue": "^2.3.3",
+        "@typescript-eslint/eslint-plugin": "^5.31.0",
+        "@typescript-eslint/parser": "^5.31.0",
+        "@vitejs/plugin-legacy": "^2.0.0",
+        "@vitejs/plugin-vue": "^3.0.1",
         "@vitejs/plugin-vue-jsx": "^1.3.10",
         "@vue/compiler-sfc": "3.2.31",
         "@vue/test-utils": "^2.0.2",
-        "autoprefixer": "^10.4.7",
-        "commitizen": "^4.2.4",
+        "autoprefixer": "^10.4.8",
+        "commitizen": "^4.2.5",
         "conventional-changelog-cli": "^2.2.2",
         "cross-env": "^7.0.3",
         "cz-conventional-changelog": "^3.3.0",
         "dotenv": "^16.0.1",
-        "eslint": "^8.19.0",
+        "eslint": "^8.21.0",
         "eslint-config-prettier": "^8.5.0",
         "eslint-plugin-prettier": "^4.2.1",
-        "eslint-plugin-vue": "^9.1.1",
+        "eslint-plugin-vue": "^9.3.0",
         "esno": "^0.14.1",
         "fs-extra": "^10.1.0",
         "husky": "^7.0.4",
@@ -133,14 +134,14 @@
         "lint-staged": "12.3.7",
         "npm-run-all": "^4.1.5",
         "picocolors": "^1.0.0",
-        "pont-engine": "^1.3.2",
+        "pont-engine": "^1.3.3",
         "postcss": "^8.4.14",
-        "postcss-html": "^1.4.1",
+        "postcss-html": "^1.5.0",
         "postcss-less": "^6.0.0",
         "prettier": "^2.7.1",
         "rimraf": "^3.0.2",
-        "rollup": "^2.75.7",
-        "rollup-plugin-visualizer": "^5.6.0",
+        "rollup": "^2.77.2",
+        "rollup-plugin-visualizer": "^5.7.1",
         "sort-package-json": "^1.57.0",
         "stylelint": "^14.9.1",
         "stylelint-config-prettier": "^9.0.3",
@@ -148,27 +149,28 @@
         "stylelint-config-recommended-vue": "^1.4.0",
         "stylelint-config-standard": "^26.0.0",
         "stylelint-order": "^5.0.0",
-        "ts-node": "^10.8.2",
+        "terser": "^5.14.2",
+        "ts-node": "^10.9.1",
         "typescript": "^4.7.4",
-        "unplugin-auto-import": "^0.7.2",
-        "vite": "^2.9.13",
+        "unplugin-auto-import": "^0.10.3",
+        "vite": "^3.0.4",
         "vite-plugin-compression": "^0.5.1",
         "vite-plugin-html": "^3.2.0",
-        "vite-plugin-mkcert": "^1.7.2",
+        "vite-plugin-mkcert": "^1.9.0",
         "vite-plugin-mock": "^2.9.6",
         "vite-plugin-optimize-persist": "^0.1.2",
         "vite-plugin-package-config": "^0.1.1",
-        "vite-plugin-purge-icons": "^0.8.1",
-        "vite-plugin-pwa": "^0.12.2",
+        "vite-plugin-purge-icons": "^0.8.2",
+        "vite-plugin-pwa": "^0.12.3",
         "vite-plugin-style-import": "^2.0.0",
         "vite-plugin-svg-icons": "^2.0.1",
         "vite-plugin-theme": "^0.8.6",
         "vite-plugin-vue-setup-extend": "^0.4.0",
-        "vite-plugin-windicss": "^1.8.6",
+        "vite-plugin-windicss": "^1.8.7",
         "vue-eslint-parser": "^9.0.3",
-        "vue-tsc": "^0.38.2"
+        "vue-tsc": "^0.39.4"
     },
     "engines": {
-        "node": "^12 || >=14"
+        "node": ">=14"
     }
 }

src/components/Application/src/AppLogo.vue

@@ -3,7 +3,7 @@
  * @Description: logo component
 -->
 <template>
-    <div class="anticon" :class="getAppLogoClass" @click="goHome">
+    <div class="anticon" :class="getAppLogoClass" @click="goHome" :title="version">
         <img src="../../../assets/images/logo.png" />
         <div class="ml-2 truncate md:opacity-100" :class="getTitleClass" v-show="showTitle">
             {{ title }}
@@ -53,6 +53,8 @@
         },
     ])
 
+    const version = `@${import.meta.env.MODE}: v${$app.version}`
+
     function goHome() {
         go(userStore.getUserInfo.homePath || PageEnum.BASE_HOME)
     }

tsconfig.json

@@ -25,6 +25,7 @@
         "types": ["vite/client"],
         "removeComments": true,
         "paths": {
+            "@/*": ["src/*"],
             "/@/*": ["src/*"],
             "/#/*": ["types/*"]
         }

types/auto-imports.d.ts

 // Generated by 'unplugin-auto-import'
-// We suggest you to commit this file into source control
+export {}
 declare global {
-  const $app: typeof import('/@/config/app')['$app']
-  const API: typeof import('/@/api/services/mods')['API']
+  const $app: typeof import('@/config/app')['$app']
+  const API: typeof import('@/api/services/mods')['API']
+  const EffectScope: typeof import('vue')['EffectScope']
   const computed: typeof import('vue')['computed']
   const createApp: typeof import('vue')['createApp']
   const customRef: typeof import('vue')['customRef']
   const defineAsyncComponent: typeof import('vue')['defineAsyncComponent']
   const defineComponent: typeof import('vue')['defineComponent']
-  const defs: typeof import('/@/api/services')['defs']
+  const defs: typeof import('@/api/services')['defs']
   const effectScope: typeof import('vue')['effectScope']
-  const EffectScope: typeof import('vue')['EffectScope']
   const getCurrentInstance: typeof import('vue')['getCurrentInstance']
   const getCurrentScope: typeof import('vue')['getCurrentScope']
   const h: typeof import('vue')['h']
   const inject: typeof import('vue')['inject']
+  const isProxy: typeof import('vue')['isProxy']
+  const isReactive: typeof import('vue')['isReactive']
   const isReadonly: typeof import('vue')['isReadonly']
   const isRef: typeof import('vue')['isRef']
   const markRaw: typeof import('vue')['markRaw']
@@ -53,5 +55,6 @@ declare global {
   const useSlots: typeof import('vue')['useSlots']
   const watch: typeof import('vue')['watch']
   const watchEffect: typeof import('vue')['watchEffect']
+  const watchPostEffect: typeof import('vue')['watchPostEffect']
+  const watchSyncEffect: typeof import('vue')['watchSyncEffect']
 }
-export {}

vite.config.ts

@@ -42,7 +42,7 @@ export default ({ command, mode }: ConfigEnv): UserConfig => {
                 },
                 // /@/xxxx => src/xxxx
                 {
-                    find: /\/@\//,
+                    find: /\/?@\//,
                     replacement: pathResolve('src') + '/',
                 },
                 // /#/xxxx => types/xxxx