2

我在 webpack / react 应用程序中使用动态导入时遇到问题。这是我的代码：

loader: (router) => import('../components/pages/home').then(component => {

  console.log(component)
  debugger;
  return router(component.default)
}

由于某种原因，模块似乎被正确导入，因为它满足导入功能条件 - 即

typeof module === "object" && module && module.__esModule

但是，该组件仍未定义。返回值为：

{HomePage: undefined, __esModule: true}

奇怪的是，如果我在文件顶部添加相同组件的静态导入，那么导入会按预期工作 - 显然这不是我想要的：D

任何帮助将不胜感激。

提前致谢！

4

1 回答 1

0

所以要解决我的问题，我必须用动态导入替换所有“require.ensure”函数。

我还必须明确地将一些 css 文件添加到我的 webpack 供应商包中，因为当延迟加载的模块需要时，它们会被捆绑器删除。

'vendor': [
   './src/less/vendor.less',

   // HACK - Explicitly adding these files to the vendor.
   // They are incorrectly removed from the bundle when required by 
   // style imports in async modules
   // https://github.com/webpack-contrib/extract-text-webpack- 
   // plugin/issues/456#issuecomment-340287722

   "style-loader/addStyles",
   "css-loader/lib/css-base",
  ],

我不确定这是否适合你 TBH 但祝你好运

于 2018-04-26T17:22:12.513 回答