process.env
.
简介
process.env 是 Node.js 中的一个环境对象。其中保存着系统的环境的变量信息。可使用 Node.js 命令行工具直接进行查看。process.env属性返回一个对象,包含了当前Shell的所有环境变量。简单来说就是你在配置文件 package.json配置webpack的环境变量都可以通过process.env来获取到
比如,process.env.HOME返回用户的主目录。 NODE_ENV 是其中的一个环境变量。这个变量主要用于标识当前的环境(生产环境,开发环境)。默认是没有这个环境变量的,需要自己手动配置。
示例
在启动命令上加的变量都可以通过process.env来获取
// An highlighted block
"scripts": {
"dev": "vue-cli-service serve",
"dev:test": "cross-env VUE_APP_TARGET=http://172.16.200.225:8080/mes-api vue-cli-service serve",
"dev:prot": "cross-env VUE_APP_BRANCH=port VUE_APP_TARGET=http://172.16.200.225:8081/mes-api vue-cli-service serve",
},
使用cross-env
在webpack项目里,我们可以通过设置package.json来实现,但是Windows 系统和Mac系统有区别。
//windows系统
"scripts": {
"dev": "vue-cli-service serve",
"dev:test": "set VUE_APP_TARGET=http://172.16.200.225:8080/mes-api vue-cli-service serve",
"dev:prot": "set VUE_APP_BRANCH=port VUE_APP_TARGET=http://172.16.200.225:8081/mes-api vue-cli-service serve",
},
//mac系统
{
"scripts": {
"dev": "export NODE_ENV=development && webpack-dev-server --open --hot",
"build": "export NODE_ENV=production && --progress --hide-modules"
}
}
那么问题又来了,我在Windows 开发部署的项目,可能在 Mac 系统无法正常打包,反之亦然。为了解决这个问题,有人就开发了 cross-env。
cross-env是一个跨平台设置环境变量的第三方包,它可以让你只配置一行命令,就能轻松地在多个平台设置环境变量。首先先安装,然后配置package.json
npm install --save-dev cross-env
// package.json
{
...
"scripts": {
"dev": "cross-env NODE_ENV=development webpack-dev-server --open --hot",
"build": "cross-env NODE_ENV=production webpack --mode=production --progress --hide-modules"
},
}
博客原文地址:https://blog.csdn.net/qq_44376306/article/details/122554570