3

我已使用本文在服务器站点https://loadable-components.com/docs/server-side-rendering/上配置代码拆分。

   const statsFile = path.resolve('../dist/public/loadable-stats.json')
    
   const extractor = new ChunkExtractor({ statsFile, entrypoints: ['browser'] })
    
   const html = ReactDOMServer.renderToString(
          extractor.collectChunks(
            <StaticRouter location={ctx.request.url} context={routeContext}>
              <Provider store={ctx.store}>
                <IntlProvider
                  locale={locale}
                  defaultLocale={locale}
                  onError={() => {}}
                >
                  <MuiThemeProvider theme={theme(locale)}>
                    <Application dynamicData={dynamicData} />
                  </MuiThemeProvider>
                </IntlProvider>
              </Provider>
            </StaticRouter>
          )
        )
 


 ......................

 ctx.body = `<!DOCTYPE html>\n${ReactDOMServer.renderToStaticMarkup(
  <Html
    helmet={Helmet.renderStatic()}
    window={{
      __STATE__: ctx.store.getState()
    }}
    css={styleTags}
    scripts={scriptTags}
    locale={ctx.locale}
    url={ctx.request.url}
    dynamicData={dynamicData}
    linkTags={linkTags}
  >
    {html}
  </Html>
)}`

据我了解entrypoints: ['browser']，通过拆分的块检测到入口点，无法通过包检测到，我应该怎么做才能检测到拆分的块？这是我尝试导入页面组件的方法

const HomePage = loadable(() => import('pages/Home'))
4

0 回答 0