我正在尝试在我的 react 应用程序中使用代码拆分，总体而言它工作得很好，但我注意到捆绑分析器中有一些奇怪的东西。我的组件文件夹与所有组件一起加载到第一个块中（即使是那些仅用于延迟加载组件的组件）。

我认为问题在于我遵循使用 index.ts 文件导出组件的结构：/components:

• /Component1
  • /Child1
    • Child1.tsx
    • index.ts
  • Component1.tsx
  • index.ts
• /Component2
  • Component2.tsx
  • index.ts
• 索引.ts

index.ts 文件只是像这样导出所需的组件

export * from './Component';

这和

import { Component } from './Component';

export { Component };

在 javascript 中。

通过这样做，我得到了非常漂亮的导入：

import { Component } from 'components';

没有深径和所有那些东西。

但我认为因为 webpack 无法识别如何拆分它，只是将其捆绑在一起。

有什么解决方案吗？也许我做错了什么？

我现在使用默认的 create react app 配置。

export * from './Component';