Ant Design Pro 如何开启代码拆分？

Question

Ant Design Pro 包在 gzip 之前可能会变得非常大。我的简单捆绑包高达 3.9MB。我们如何使用 Ant Design Pro 启用代码拆分。我在V4 Ant Design Pro的文档中好像找不到。

Answer 1

好的，我明白了。如果有人有同样的问题，请在此处发布，因为它尚未记录。事实证明，默认情况下代码拆分是关闭的。在配置文件中查找 dynamicImport 属性并取消注释。

config/config.js

const plugins = [
  [
    'umi-plugin-react',
    {
      antd: true,
      dva: {
        hmr: true,
      },
      locale: {
        ...
        baseNavigator: true,
      },
      dynamicImport: {
        loadingComponent: './components/PageLoading/index',
        webpackChunkName: true,
        level: 3,
      },
     ...
    }
  ]
]

Answer 2

https://github.com/ant-design/ant-design-pro/blob/7effcb09f40bb00f707738f7fdc4d5852a8e2dc9/config/config.ts#L28-L32

开启umi配置dynamicImport。

https://umijs.org/plugin/umi-plugin-react.html#dynamicimport

Ant Design Pro 如何开启代码拆分？

How do you enable code splitting in Ant Design Pro?

javascript

reactjs

ant-design-pro