webpack使用cross-env不同环境配置
一.项目背景
在配置webpack构建项目工程环境时,需要配置能够随时切换开发环境或生产环境,还有测试环境的打包命令,使用
cross-env可以很轻松的解决问题
二.使用
1.cross-env的作用
cross-env的作用是不需要全局配置NODE_ENV,在scripts脚本中修改NODE_ENV的值从而实现不同环境中proccess.env.NODE_ENV的不同，而config的工作原理就是基于NODE_ENV这个值的，所以推荐两者结合使用。
2.安装
$ npm install --save-dev cross-env
3.嵌入命令使用
"dev": "cross-env NODE_ENV=development webpack-dev-server --config webpack.config.js",
"build": "cross-env NODE_ENV=production webpack --config webpack.config.js",
在执行命令前面嵌入cross-env的命令 NODE_ENV在全局可以使用,后面跟 环境的参数
4.获取全局变量
//webpack.config.js
//获取全局环境变量(根据package.json里的cross-env配置取值)
const NODE_ENV = process.env.NODE_ENV;
根据NODE_ENV 可以区分相应的环境,然后做逻辑判断,处理开发环境和生产环境不同的打包命令!