美文网首页
前端配置多环境打包

前端配置多环境打包

作者: MercuryWang | 来源:发表于2019-07-27 10:18 被阅读0次

转载自:https://segmentfault.com/a/1190000018072031

UMI 框架封装的很好,查了很多解决方案,亲测这个方法有效,也是最简单的。

1. 安装 corss-env

UMI 2.0 以上版本应该是默认安装好的,只是没有使用,所以安装之前可以检查下 package.json 文件,如有,可忽略此步骤。

npm install --save-dev cross-env
2. 在 config/config.js 文件里配置开发环境的 apiUrl
 define: {
    "process.env.apiUrl":'https://www.dev.com/'
  },
3. 复制两次 config/config.js,并更改文件名为 config/config.test.jsconfig/config.prod.js,分别配置 apiUrl
// config.test.js
 define: {
    "process.env.apiUrl":'https://www.test.com/'
  },
// config.prod.js
 define: {
    "process.env.apiUrl":'https://www.prod.com/'
  },
4. 在其他文件可以获取 process.env.apiUrl 作为url前缀,如封装 axiosrequest.js
// request.js
console.log(process.env.apiUrl);
5. 在 package.jsonscripts 处配置打包命令
"build-dev": "cross-env UMI_ENV=dev umi dev",
"build-test": "cross-env UMI_ENV=test umi build",
"build-prod": "cross-env UMI_ENV=prod umi build",

相关文章

网友评论

      本文标题:前端配置多环境打包

      本文链接:https://www.haomeiwen.com/subject/amssrctx.html