Vue项目配置环境变量

        项目开发过程中，至少会经历开发环境、测试环境和生产环境(即正式环境)三个阶段。不同阶段请求的状态(如接口地址等)不尽相同，若手动切换接口地址是相当繁琐且易出错的。于是环境变量配置的需求就应运而生，我们只需做简单的配置，把环境状态切换的工作交给代码。

1.项目根目录分别添加 开发、生产和测试环境的文件

.env.development
.env.production
.env.test

2.文件内容

//变量必须以 VITE_ 为前缀才能暴露给外部读取
NODE_ENV = 'development'
VITE_APP_TITLE = '项目名称'

NODE_ENV = 'production'
VITE_APP_TITLE = '项目名称'

NODE_ENV = 'test'
VITE_APP_TITLE = '项目名称'

3.配置运行命令：package.json

 "scripts": {
    "dev": "vite --open",
    "build:test": "vue-tsc && vite build --mode test",
    "build:pro": "vue-tsc && vite build --mode production",
    "preview": "vite preview"
  }

4.通过import.meta.env获取环境变量