我们在代码开发到上线阶段的过程中可能会涉及到不同的环境，例如：开发环境，测试环境，以及生产环境 对于不同的环境，我们可能会涉及到不同的配置，打个比方说：我们在发送aixos网络请求的时候，不同的环境所发送的请求地址可能不一样，此时我们需要有一个东西来进行区分——环境变量
如何定义环境变量
命令行临时定义
创建环境变量
这种方式是在我们启动相关命令的时候进行环境变量的临时定义 linux：
NODE_ENV=production npm run build
window： 方法一：使用 cross-env 跨平台配置
npm install cross-env --save-dev
修改 package.json 中的脚本配置
"scripts": {
"dev": "cross-env test=111 vue-cli-service serve"
}
方法二：Windows 原生命令格式
set "VUE_APP_TEST=111" && npm run dev
这种方式只会在当前服务运行过程中生效，如果此次服务停止，下次启动的时候直接使用命令是不具备NODE_ENV=production的效果，因此不推荐这种方式
读取环境变量
package.json脚本写法(跨平台推荐)
我们可以在package.json文件中添加我们需要使用的环境变量
创建环境变量
{
"script"：{
"start":"NODE_ENV=development npm run dev"
}
}
使用环境变量
我们可以直接在项目中的各个地方直接用process.env.NODE_ENV 读取环境变量 这种方式比较推荐在跨平台的用法上
使用.env文件
创建环境变量
在项目根目录下新建.env .env.developmenet .env.production等文件:
.env文件
NODE_ENV=development
.env.production
NODE_ENV=production
Vue CLI , Vite 等会自动加载和选择这些文件，会根据你当前的环境来自动选择合适的.env文件
文件分类
通常有以下几种：
-.env（所有环境都会加载，基础配置）
-.env.developementP(开发环境专用)
-.env.production(生产环境专用)
-.env.test(测试环境专用)
加载优先级
文件加载优先级排序：
-.env.[mode].local(如.env.development.local)
-.env.[mode] (如.env.development)
-.env.local
-.env
环境区分
如何区分环境
-开发环境：当你运行npm run serve , pnpm run dev会自动设置process.env.NODE_ENV=development , 加载 .env.development
-生产环境：当你运行npm run build , pnpm run build会自动设置process.env.NODE_ENV=production ，加载.env.production
-测试环境：当你运行npm run test,会自动设置 process.env.NODE_ENV=test,加载.env.test
使用变量
在.env文件中定义的变量(例如VUE_APP_API_URL=xxx)，可以在代码中通过process.env.VUE_APP_API_URL进行读取，但是要注意的是 自定义变量必须以VUE_APP_(Vue CLI) , VITE_(Vite) , REACT_APP_ (CRA)开头
这种方法好用并且简单，推荐！
