使用 umi + dva 开发配置接口环境

乌米文档，创建项目模板啥的就不说了

关于选择project， 自定义开发的话， 选择 app 选项，其它不多说了

之后会问你选择 ts 吗？ ，是否使用antd， dva， code spliting ，dll，可选的，自己决定

最后，启动项目，打开控制台，一堆警告，和错误提示，关于警告，就是react 钩子在新版本已经换名字了，现在的这些以后会过时了，都是 .umi 文件报的，并不是实例代码错误，你可以选择不展示在控制台

在控制台把这个关闭就不会展示了

目录结构呢，就不说了，文档上有的

接着，通过环境变量 UMI_ENV 区分不同环境来指定配置。配置开发环境，测试环境，和生产接口环境

1. 安装  cross-env

yarn add cross-env

2. 修改 .umirc.js 文件，添加一个 define属性（这个是测试及开发）

3. 配置生产环境，赋值一份这个文件 改名为 .umirc.prod.js ，把接口换成你的正式服务器接口

4.  修改打包指令， 在package.json  中 

  "scripts": {
    "start": "umi dev",
    "test": "umi test",
    "devbuild": "cross-env UMI_ENV=dev umi build",
    "build": "cross-env UMI_ENV=prod umi build",
    "lint": "eslint --ext .js src mock tests",
    "precommit": "lint-staged"
  },

5. 测试，在 app.js 中 写入打印 process.env.apiUrl ， 然后重启 开发 服务

export const dva = {
  config: {
    onError(err) {
      err.preventDefault();
      console.error(err.message);
    },
  },
};
console.log(process.env.apiUrl);

6. 打印开发 成功 ！

7. 测试服务器接口打包， 执行 npm run devbuild ，打印同开发环境

8. 打印生产接口地址

关于其它多项配置，自己参考文档吧

至此，不同的环境打包配置完毕，接下来，你就可以在 src 下创建 utils 文件，封装 ajax 服务了

baseUrl 就是 process.env.apiUrl的值