vite 环境变量配置

Vite 是一个基于 ES 模块的现代前端构建工具，它提供了一个轻量级、快速的开发体验。在 Vite 中，环境变量配置通常通过 `.env` 文件或者称为“环境插件”来进行管理，目的是为了在生产环境和开发环境中分离敏感信息和配置。

1. **`.env` 文件**: 使用 `.env` 文件可以保存全局的环境变量。Vite 支持自动加载 `.env`, `.env.local`, 和 `.env.{stage}`（如 `.env.dev` 或 `.env.production`) 文件，其中 `{stage}` 可以是 `dev`, `prod`, `test` 等。每个阶段对应一个特定的环境变量集。例如：

   PORT=8080
   API_URL=http://localhost:3000

2. **环境插件 (vite-plugin-env)**: Vite 官方推荐使用第三方插件如 `vite-plugin-env` 来更方便地处理环境变量。通过该插件，你可以通过 `process.env.VAR_NAME` 访问环境变量，它们会被解析成相应的值。

3. **Vite 构建命令**: 当你在构建应用时，你可以传递环境变量到 Vite，这通常是通过 `VITE_MODE` 或者 `VITE_CONFIG` 环境变量来指定，例如：
- 开发模式 (`dev`): `VITE_MODE=development vite`
- 生产模式 (`prod`): `VITE_MODE=production vite build`

4. **跨平台部署**:
- 对于CI/CD系统，你可以通过配置 CI 工具（如 GitLab CI/CD, CircleCI, Travis CI 等）将不同的环境变量传入构建过程。

配置完成后，Vite 将在相应的环境中加载不同的变量，以便保持代码的灵活性和安全性。