diff --git a/.env.development b/.env.development index 891be06b..ee6c1c96 100644 --- a/.env.development +++ b/.env.development @@ -1,5 +1,7 @@ # 开发环境变量 -ENV = 'development' -# base api -VITE_BASE_API = '/dev-api' +# 变量必须以 VITE_ 为前缀才能暴露给外部读取 + +VITE_APP_TITLE = '管理系统' +VITE_APP_PORT = 3000 +VITE_APP_BASE_API = '/dev-api' diff --git a/.env.production b/.env.production index 3ccdefb0..89e04cae 100644 --- a/.env.production +++ b/.env.production @@ -1,6 +1,4 @@ # 生产环境变量 -ENV = 'production' - -# base api -VITE_BASE_API = '/prod-api' - +VITE_APP_TITLE = '管理系统' +VITE_APP_PORT = 3000 +VITE_APP_BASE_API = '/prod-api' diff --git a/.env.staging b/.env.staging index 21ea2060..da543f6a 100644 --- a/.env.staging +++ b/.env.staging @@ -1,6 +1,4 @@ # 模拟环境变量 -ENV = 'staging' - -# base api -VITE_BASE_API = '/stage-api' - +VITE_APP_TITLE = '管理系统' +VITE_APP_PORT = 3000 +VITE_APP_BASE_API = '/stage-api' diff --git a/README.md b/README.md index 16deb6cc..07fe6f7b 100644 --- a/README.md +++ b/README.md @@ -265,45 +265,55 @@ export default defineComponent({ ## Vite 环境变量配置 -**官方说明:** https://cn.vitejs.dev/guide/env-and-mode.html +**官方环境变量配置文档:** https://cn.vitejs.dev/guide/env-and-mode.html -项目根目录添加多个环境的配置文件 +#### 多环境配置 开发环境变量文件:`.env.development` ```properties # 开发环境变量 -ENV = 'development' -# base api -VITE_BASE_API = '/dev-api' +# 变量必须以 VITE_ 为前缀才能暴露给外部读取 + +VITE_APP_TITLE = '管理系统' +VITE_APP_PORT = 3000 +VITE_APP_BASE_API = '/dev-api' + ``` - 生产环境变量文件:`.env.production` ```properties # 生产环境变量 -ENV = 'production' - -# base api -VITE_BASE_API = '/prod-api' +VITE_APP_TITLE = '管理系统' +VITE_APP_PORT = 3000 +VITE_APP_BASE_API = '/prod-api' ``` - 模拟环境变量文件:`.env.staging` ```properties # 模拟环境变量 -ENV = 'staging' - -# base api -VITE_BASE_API = '/stage-api' +VITE_APP_TITLE = '管理系统' +VITE_APP_PORT = 3000 +VITE_APP_BASE_API = '/stage-api' ``` +#### 环境变量智能提示 +`src/env.d.ts` 添加以下配置 + +```typescript +// 环境变量智能提示 +interface ImportMetaEnv { + VITE_APP_TITLE: string, + VITE_APP_PORT: string, + VITE_APP_BASE_API: string +} +``` ## 生产打包配置 diff --git a/src/env.d.ts b/src/env.d.ts index d27eb5a3..e8b0bee7 100644 --- a/src/env.d.ts +++ b/src/env.d.ts @@ -6,3 +6,11 @@ declare module '*.vue' { const component: DefineComponent<{}, {}, any> export default component } + + +// 环境变量智能提示 +interface ImportMetaEnv { + VITE_APP_TITLE: string, + VITE_APP_PORT: string, + VITE_APP_BASE_API: string +} \ No newline at end of file