umi中使用多环境配置

在Umi（一个基于React的前端框架）中，多环境配置主要是为了支持开发、测试、生产等多个阶段的不同设置。Umi通过`.umirc.js`（或`.umi.config.js`）文件来管理项目的配置，你可以根据不同环境（如`development`, `production`等）创建不同的配置块。

以下是如何在Umi中进行多环境配置的基本步骤：

1. **创建`.umirc.js`文件**：如果还没有，你需要先初始化一个基本的Umi项目并生成这个文件。

// .umirc.js 或 .umi.config.js
module.exports = {
  // ...
};

2. **添加环境变量**：
- 添加默认环境配置：

     env: {
       production: process.env.NODE_ENV === 'production',
       development: !process.env.NODE_ENV || process.env.NODE_ENV === 'development', // 非生产环境即视为开发环境
     },

- 根据环境加载对应的配置：

     plugins: [
       ['umi-plugin-react', { antd: true }],
       {
         enable: env.production,
         path: '@umijs/plugin-prod',
         options: {},
       },
     ],

3. **针对不同环境修改配置**：
- 对于开发环境，可以设置更详细的调试选项：

     develop: {
       extraBabelPlugins: [['import', { libraryName: 'antd', libraryDirectory: 'es', style: true }]],
     },

- 生产环境可能需要压缩代码和开启性能优化：

     build: {
       hash: true,
       minify: env.production,
     },

4. **环境切换**：在运行项目前，可以通过设置`NODE_ENV`环境变量来选择特定的环境。例如：
- 开发环境：`npm run dev`
- 生产环境打包：`npm run build -- --prod`