1.使用 cross-env 插件
> cross-env 运行跨平台设置, 如:Windows和POSIX命令使用环境变量是有区别。
2.脚本命令编写
"script": {
<!--设置ENV_DEPLOY和ENV_ENVIRONMENT两个环境变量,只能在node环境通过process.env访问,浏览器访问不到-->
"sit": "cross-env ENV_DEPLOY=true ENV_ENVIRONMENT=sit node node build/build.js",
"pro": "cross-env ENV_DEPLOY=true ENV_ENVIRONMENT=pro node node build/build.js",
}
3.使用weback.DefinePlugin()方法
> 用于创建编译时 “配置的全局常量” 以方便进行 环境转换
```js
new webpack.DefinePlugin({
'process.env': config.dev.env // config文件下的dev.env.js和prod.env.js下配置
}),
```
```js
//prod.env.js
module.exports = {
NODE_ENV: '"production"',
/** 发布部署模式 */
ENV_TEST: "'TEST-STRING'"
ENV_DEPLOY: process.env.ENV_DEPLOY,
ENV_TYPE: JSON.stringify(process.env.ENV_TYPE),// 字符串要用json.string或者"''"
};
```
4.使用
```js
//main.js
const env_type = process.env.ENV_TYPE
console.log(env_type)
```
总结
> 在node环境通过NPM脚本配置环境变量,然后通过,weback的DefinePlugin方法配置全局的变量(浏览器端才可访问),可以解决配置多环境代码下打包兼容。