我们在项目开发过程中，至少会经历开发环境、测试环境和生产环境三个阶段。不同阶段请求的状态（如接口地址等）不尽相同，若手动切换接口地址是相当繁琐切容易出错的。于是环境变量配置的需求就应运而生，我们只需做简单的配置，把环境状态切换的工作交给代码。
开发环境——development
测试环境——testing
生产环境——production
一般情况下，一个环境对应一台服务器，也有的公司开发与测试环境是同一台服务器！
项目根目录分别添加开发、生产和测试环境的文件！
.env.development
.env.production
.env.test
分别配置三个环境变量
.env.development
NODE_ENV = 'development'
VITE_APP_TITLE = '运营平台'
VITE_APP_BASE_API = '/dev-api'
.env.production
NODE_ENV = 'production'
VITE_APP_TITLE = '运营平台'
VITE_APP_BASE_API = '/prod-api'
.env.test
NODE_ENV = 'test'
VITE_APP_TITLE = '运营平台'
VITE_APP_BASE_API = '/test-api'
package.json中配置运行命令
"scripts": {"dev": "vite --open","build": "vue-tsc && vite build","build:test": "vue-tsc && vite build --mode test","build:prod": "vue-tsc && vite build --mode production","preview": "vite preview"
}
获取环境变量:
在组件中直接打印就可以获取到当前环境变量了。
如执行npm run serve命令，会自动加载.env.development文件
console.log(import.meta.env)
