1.在项目根目录下新建.env文件,文件内部如下:
VUE_APP_MY_NAME = '嘻嘻哈哈'
可在main.js中 打印 console.log(process.env.VUE_APP_MY_NAME, 'env') 即可获取到添加的VUE_APP_MY_NAME 变量
** 注意 **
.env 文件会在所有的环境中被载入
配置开发环境环境变量
1.新建.env.development文件
NODE_ENV = 'development' //模式
NODE_BASE_URL = 'http://xxxxxxxxxx' // 开发环境api地址
// 自定义环境变量(全部为大写,并且以VUE_APP开头)
VUE_APP_TEXT = '嘿嘿嘿嘿'
2.在package.json文件,scripts节点中添加
"test": "cross-env vue-cli-service serve --mode development"
3.在终端运行此脚本
可在main.js中 打印 console.log(process.env, 'env') 即可获取到配置的所有变量
配置测试环境环境变量
1.新建.env.test文件
NODE_ENV = 'test' //模式
NODE_BASE_URL = 'http://xxxxxxxxxx' // 开发环境api地址
// 自定义环境变量(全部为大写,并且以VUE_APP开头)
VUE_APP_TEXT = '嘿嘿嘿嘿'
2.在package.json文件,scripts节点中添加
"serve:test": "cross-env vue-cli-service serve --mode test"
3.在终端运行此脚本
可在main.js中 打印 console.log(process.env, 'env') 即可获取到配置的所有变量
配置测试生产环境变量
1.新建.env.production文件
NODE_ENV = 'production' //模式
NODE_BASE_URL = 'http://xxxxxxxxxx' // 开发环境api地址
// 自定义环境变量(全部为大写,并且以VUE_APP开头)
VUE_APP_TEXT = '嘿嘿嘿嘿'
2.在package.json文件,scripts节点中添加
"serve:prod": "cross-env vue-cli-service serve --mode production"
3.在终端运行此脚本
可在main.js中 打印 console.log(process.env, 'env') 即可获取到配置的所有变量