webpack从多个条目文件导出类

Question

我正在使用webpack捆绑一个供第三方使用的框架.该框架应该公开多个ES6类.以模块化方式构建,我为每个文件编写了一个类.我想要做的是将所有这些文件一起构建,并将它们捆绑在给定的"命名空间"下.例:

apples.js export class Apples {...}
oranges.jsexport class Oranges {...}

webpack.config.js:

module.exports = {
  entry: ['./src/apples.js', './src/oranges.js'],
  output: {
    path: './dist',
    filename: 'fruit.js',
    library: 'Fruit',
    libraryTarget: 'umd'
  }
}

但是,如果我在浏览器中加载此库并键入fruit控制台,我只会看到Fruit下的Oranges对象.只有最后一个条目文件在库中显示出来.当然,webpack文档证实了这种行为:

如果传递数组:启动时加载所有模块.最后一个是导出的. http://webpack.github.io/docs/configuration.html#entry

我目前的解决方法是从一个文件导出我的所有类,但它变得非常笨拙.

如何设置包含所有导出的多个条目文件的库？或者我在这里做错了什么？

Answer 1

我认为您最好使用entry.js 文件来指示如何组织多个模块。

import Apples from './apples';
import Oranges from './oranges';

export {
    Apples,
    Oranges
};

顺便说一句，如果你不想自己编写这样愚蠢的代码，请使用 Gulp/Grunt 通过某种逻辑生成文件“entry.autogenerate.js”，然后使用条目“entry.autogenerate.js”运行 webpack 。