登录 ×

梨花寨前端技术交流平台!

html,css,js,html5,css3等

cross-env跨平台地设置及使用环境变量

2018-07-11 15:36:23 | 浏览量:110 webpack
    在项目开发过程中,需要测试这个环节,需要模拟线上的真实环境。有一些配置是和本地开发不同,如域名,图片服务器地址等等。一般采用通过接收不同的环境变量,在webpack.config.js文件再判断做不同配置处理。利用cross-env这个工具把这一过程变得很容易。

npm安装方式:

npm i --save-dev cross-env

在npm脚本(多是package.json)里这么配置

{
 "scripts": {          
  "build-rd":"cross-env ENVIRON=rd webpack --mode production --config webpack.config.js",
  "build-qa":"cross-env ENVIRON=qa webpack --mode production --config webpack.config.js",
 }
}

运行npm run build-rd 或者npm run build-qa,这样NODE_ENV便设置成功,无需担心跨平台问题。在webpack.config.js文件中可以轻松通过process.env.ENVIRON获取上面设置的"rd"或"qa"。

如:

if(process.env.ENVIRON === 'rd') {
  //coding

}else if(process.env.ENVIRON === 'qa') {
 //coding
}


需求及问题提交:

点击图片更换数字

0.3644s