当前位置: 首页 > Web前端 > vue.js

.env前端环境变量配置

时间:2023-03-31 22:54:41 vue.js

前言项目有开发环境,测试环境,线上环境,里面的接口域名是不一样的。每次调试或打包的时候都手动更改每个变量,既麻烦又容易出错。因此,直接以自动化的方式配置不同的环境变量。文件配置在项目根目录下添加一个文件,配置变量.env.development(本地环境变量)NODE_ENV='development'VUE_APP_URL='http://dev.xxx.com'.env.production(在线环境变量NODE_ENV='production'VUE_APP_URL='http://prod.xxx.com'启动配置配置package.json中的脚本在本地运行"serve":"vue-cli-serviceserve--modedevelopment"在本地运行,使用在线环境variable"serve:prod":"vue-cli-serviceserve--modeproduction"如果需要传入环境变量,可以加上cross-envNODE_ENV=development,其中cross-env兼容mac"serve:prod":"cross-envNODE_ENV=developmentvue-cli-serviceserve--modeproduction"package"build":在"vue-cli-servicebuild--modeproduction"中使用console.log(process.env.VUE_APP_URL)项目