使用 Webpack 动态导入命名导出

Question

使用 webpack，如果我想对整个模块进行代码拆分，我可以更改

import Module from 'module'

在我的文件顶部

import('module').then(Module => {...

当我需要使用模块时 (docs)。是否可以只使用一个命名导出来做到这一点？也就是说，我如何对以下内容进行代码拆分：

import {namedExport} from 'module'

Answer 1

const DynamicFoo = dynamic(import('../components/Foo').then(module => {
  const {Foo} = module
  return Foo
}));

或

import(/* webpackChunkName: "chunkName" */ '../component/Foo').then(module => {
  const {Foo} = module.default
  this.setState({ foo: Foo })
})

Dynamic import named export using Webpack