在实际项目开发中,经常会碰到需要环境变量的情景,在vue-cli的环境下,默认已经配置了一个NODE_ENV的环境变量,当npm run dev
的时候这个是development, 当npm run build
的时候这个是production.用过vue-cli开发的通常对这个都不陌生,用这个最多的基本就是我们配置ajax请求的域名头了,
if (process.env.NODE_ENV === 'production') {
axios.defaults.baseURL = 'http://customer.medsci.cn'
}
通常会有测试服务器和正式服务器环境之分,我们请求的域名也得区分,所以通过proces.env.NODE_ENV来区分环境变量,通过这个能够全局访问的参数,我们可以处理很多需要环境处理不同的操作.
上面的process.env.NODE_ENV是vue-cli默认配置的,有时候我们可能觉得光是只有一个开发环境和生产环境还不够,比如我们还想来一个测试坏境,这时候就需要自己定义了.以下以windows坏境为例,mac环境类似.
首先可以安装cross-env
npm install cross-env --save-dev
vue-cli的配置本质就是webpack的配置,当我们运行npm run dev
的时