feat: ✨新增环境配置dev、prod及生产编译自动添加配置文件

README.md

@@ -1,6 +1,9 @@
 # tsdd-control
 * NODE_ENV node环境变量
 * APP_ENV 应用环境变量
+  - dev 开发环境
+  - pord 生产环境
+* IS_CONFIG 是否添加配置文件
 
 ## 安装
 
@@ -20,6 +23,12 @@ pnpm dev
 pnpm build
 ```
 
+## 配置文件编译
+
+``` sh
+pnpm build:config
+```
+
 ## 本地预览
 > 先执行编译再执行该命令
 

package.json

@@ -3,8 +3,9 @@
   "private": true,
   "version": "1.0.0",
   "scripts": {
-    "dev": "vite",
+    "dev": "cross-env APP_ENV=dev vite",
-    "build": "vite build",
+    "build": "cross-env APP_ENV=prod vite build",
+    "build:config": "cross-env APP_ENV=prod IS_CONFIG=true vite build",
     "preview": "vite preview",
     "new": "plop",
     "lint": "eslint src --fix --ext .ts,.tsx,.vue,.js,.jsx,",
@@ -40,6 +41,7 @@
     "@unocss/vite": "^0.51.12",
     "@vitejs/plugin-vue": "^4.2.3",
     "@vitejs/plugin-vue-jsx": "^3.0.1",
+    "cross-env": "^7.0.3",
     "eslint": "^8.40.0",
     "eslint-config-prettier": "^8.8.0",
     "eslint-plugin-prettier": "^4.2.1",

pnpm-lock.yaml

@@ -88,6 +88,9 @@ devDependencies:
   '@vitejs/plugin-vue-jsx':
     specifier: ^3.0.1
     version: 3.0.1(vite@4.4.1)(vue@3.3.4)
+  cross-env:
+    specifier: ^7.0.3
+    version: 7.0.3
   eslint:
     specifier: ^8.40.0
     version: 8.40.0
@@ -2539,6 +2542,14 @@ packages:
     requiresBuild: true
     dev: false
 
+  /cross-env@7.0.3:
+    resolution: {integrity: sha512-+/HKd6EgcQCJGh2PSjZuUitQBQynKor4wrFbRg4DtAgS1aWO+gU52xpH7M9ScGgXSYmAVS9bIJ8EzuaGw0oNAw==}
+    engines: {node: '>=10.14', npm: '>=6', yarn: '>=1'}
+    hasBin: true
+    dependencies:
+      cross-spawn: 7.0.3
+    dev: true
+
   /cross-spawn@7.0.3:
     resolution: {integrity: sha512-iRDPJKUPVEND7dHPO8rkbOnPpyDygcDFtWjpeWNCgy8WP2rXcxXL8TskReQl6OrB2G7+UJrags1q15Fudc7G6w==}
     engines: {node: '>= 8'}

src/config/index.ts

@@ -10,12 +10,21 @@ export const DEFAULT_PRIMARY = '#5371FF';
 // 路由白名单地址（必须是本地存在的路由 staticRouter.ts 中）
 export const ROUTER_WHITE_LIST: string[] = ['/login'];
 
+// 自定义应用根据运行环境获取配置
+const modules: any = {};
+const moduleFiles = import.meta.glob('./modules/*.ts', { import: 'default', eager: true });
+
+Object.keys(moduleFiles).forEach(name => {
+  const key = name.replace('./modules/', '').replace('.ts', '').trim();
+  modules[key] = moduleFiles[name];
+});
+
 const TSDD_CONFIG = window.TSDD_CONFIG ? window.TSDD_CONFIG : {};
 // 默认应用配置
 export const BU_DOU_CONFIG = {
   APP_TITLE: '唐僧叨叨后台管理',
   APP_TITLE_SHORT: '唐',
-  APP_URL: 'https://api.botgate.cn/v1/',
+  ...modules[process.env.APP_ENV as any],
   ...TSDD_CONFIG
   // APP_URL: '/api/v1/' // 正式环境地址 (通用打包镜像，用此相对地址)
 };

src/config/modules/dev.ts

@@ -0,0 +1,4 @@
+export default {
+  APP_ENV: 'dev',
+  APP_URL: 'https://api.botgate.cn/v1/'
+};

src/config/modules/prod.ts

@@ -0,0 +1,4 @@
+export default {
+  APP_ENV: 'prod',
+  APP_URL: '/api/v1/'
+};

vite.config.ts

@@ -13,7 +13,8 @@ import Layouts from 'vite-plugin-vue-meta-layouts';
 import Pages from 'vite-plugin-pages';
 import compression from 'vite-plugin-compression';
 
-const getPlugins = (command: string) => {
+const getPlugins = (_command?: string) => {
+  console.log(process.env.IS_CONFIG);
   return [
     AutoImport({
       include: [/\.[tj]sx?$/, /\.vue\?vue/, /\.md$/],
@@ -39,7 +40,7 @@ const getPlugins = (command: string) => {
       inject: {
         data: {
           title: '唐僧叨叨后台管理',
-          injectScript: command === 'build' ? `<script src="/tsdd-config.js"></script>` : null
+          injectScript: process.env.IS_CONFIG ? `<script src="/tsdd-config.js"></script>` : null
         }
       }
     }),