Vite 中环境变量需以 VITE_ 开头定义在 .env 文件中，通过 import.meta.env 在客户端读取；服务端需用 process.env 并配合 dotenv 加载。
在 Vite 中使用环境变量，核心是通过 .env 文件定义 + import.meta.env 在代码中读取。Vite 默认只暴露以 VITE_ 开头的变量，这是出于安全考虑，防止敏感信息（如 API 密钥、数据库密码）意外泄露到客户端。
如何定义环境变量（.env 文件）
Vite 支持多环境文件，按优先级从高到低依次加载：
-
.env.[mode]（如.env.production）→ 仅在对应模式下生效，优先级最高 -
.env.[mode].local（如.env.development.local）→ 本地覆盖，不提交到 Git（建议加到.gitignore） -
.env→ 所有模式通用，默认基础配置
注意：所有变量必须以 VITE_ 开头才能被注入到客户端代码中。例如：
VITE_APP_TITLE=My App
SECRET_KEY=123456 ← 这个不会出现在 import.meta.env 中
如何在代码中读取环境变量
直接使用 import.meta.env 对象访问，它是一个编译时静态替换的只读对象：
-
import.meta.env.VITE_API_BASE_URL→ 返回字符串"https://api.example.com" -
import.meta.env.MODE→ 当前模式（"development"/"production"） -
import.meta.env.PROD→ 布尔值，等价于MODE === 'production' -
import.meta.env.DEV→ 布尔值，等价于MODE === 'development'
示例：
const api = `${import.meta.env.VITE_API_BASE_URL}/users`;console.log('当前环境：', import.meta.env.MODE);
类型提示支持（TypeScript）
若用 TypeScript，需在项目根目录的 env.d.ts 中扩展类型：
interface ImportMetaEnv {
readonly VITE_API_BASE_URL: string;
readonly VITE_APP_TITLE: string;
// 其他自定义 VITE_* 变量
}
这样编辑器和 TS 编译器就能识别并提供自动补全与类型检查。
服务端或构建脚本中读取环境变量
import.meta.env 仅在浏览器端（或 Vite 构建产物中）可用。若需在 Node.js 环境（如 vite.config.ts、插件、CI 脚本）中读取，应使用 Node 原生方式：
- 用
process.env.VITE_XXX（需确保已通过dotenv加载） - Vite 会自动为
vite.config.ts加载.env和.env.[mode]，所以可直接用process.env.VITE_API_BASE_URL - 其他 Node 脚本建议手动加载：
import 'dotenv/config'（需安装dotenv）
