0

我正在构建一个要在 React 应用程序中导入的组件库。我想公开这些组件,以便可以在应用程序中动态导入它们。

我尝试了什么:

库 > index.js

export const Component1 = import(/* webpackChunkName: "components/Component1" */ './components/Component1')
export const Component2 = import(/* webpackChunkName: "components/Component2" */ './components/Component2')

库 > webpack.config.js

entry: path.resolve('src/index.js'),
output: {
    path: path.resolve('build'),
    filename: 'index.js',
    chunkFilename: '[name].js',
    library: 'lib',
    libraryTarget: 'umd'
},

构建结果

80.13 KB  build/index.js
69.68 KB  build/components/Component1.js
12.4 KB   build/components/Component2.js

我想要达到的目标:

应用 > index.js

import('lib/components/Component1').then(module => {
    console.log(module) // Empty object so far
})

我想如何导出组件以便它们一一可用?还是有其他方法?

4

1 回答 1

0

最后,我通过使用此处定义的配置成功地实现了我的意思:https ://github.com/webpack/webpack/tree/master/examples/multi-part-library

我不再异步导入组件,而是在 webpack 配置中设置不同的条目。

于 2017-10-09T14:48:56.837 回答