代码拆分 React 组件答案

【问题标题】：Code Splitting React components代码拆分 React 组件
【发布时间】：2017-05-15 11:48:54
【问题描述】：

我对 React 相对较新（准确地说，我使用的是 preact.js），我正在尝试使用 webpack 2 编写代码拆分反应组件。

我正在按照文档中的说明导出我的组件，然后我将 importing 加载它。

  import('./components/List').then((List) => {
    render(<List />, document.getElementById('main'));
  });

脚本加载，但我没有正确处理 promise 回调，并且很难看到任何显示工作版本的文档。

List 返回以下对象：

【问题讨论】：

then 里面有什么？
让我用控制台转储更新
运行此代码实际上不会返回任何错误或任何内容。渲染什么都不做。
在 then 中放入调试器并检查参数值。
未捕获（承诺中）DOMException：无法在“文档”上执行“createElement”：提供的标记名称（“[object Object]”）不是有效名称。

【解决方案1】：

我看到了你的回购。看起来您的列表组件没有export default。我会添加default 并在你的then 中，当你处理承诺时，我会这样做

.then(module => {
   const Component = module.default;
   render(<Component />, document.getElementById('main'))
})

【讨论】：