reactjs - 在 webpack 包分析器中看到延迟加载的模块是否正常？

Question

问题

我的问题是 webpack 分析器不断向我显示我不想要的模块。我不知道这是否正常。

代码

import React, { ReactElement, Suspense } from 'react';
import ReactDOM from 'react-dom';
const SwaggerUI = React.lazy(() => import('swagger-ui-react'));

const rootElement = document.getElementById('root');

const App = (): ReactElement => {
  return (
    <div>
      <Suspense fallback={<div>Loading...</div>}>
        <SwaggerUI url='https://petstore.swagger.io/v2/swagger.json' />
      </Suspense>
    </div>
  );
};

if (module.hot) {
  module.hot.accept();
}

ReactDOM.render(<App />, rootElement);

我如何运行分析器

包.json：

"analyzer:prod": "BUNDLE_ANALYZER=true NODE_ENV=production webpack --mode production"

命令：

npm run analyzer:prod

结果

Answer 1

是的，我认为它也向您显示延迟加载的组件是正常的。这些组件将被延迟加载（在用户单击或请求时），但我们仍然关心它们的大小并希望在此视图中分析这些细节。