webpack export 类 from multiple entry files

Question

我正在使用 webpack 捆绑一个框架供第 3 方使用。这个框架应该公开多个 ES6 classes。以模块化方式构建，我为每个文件编写了一个 class。我想要做的是将所有这些文件构建在一起，并将它们捆绑在给定的“命名空间”下。示例：

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 文档证实了这种行为：

If you pass an array: All modules are loaded upon startup. The last one is exported. http://webpack.github.io/docs/configuration.html#entry

我目前的解决方法是从一个文件中导出我所有的 classes，但它变得非常笨拙。

我该如何设置一个包含多个条目文件且全部导出的库？还是我在这里做错事了？

Answer 1

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

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

export {
    Apples,
    Oranges
};

顺便说一下，如果你不想自己写这么蠢的代码，使用Gulp/Grunt通过某种逻辑生成文件'entry.autogenerated.js'然后运行 webpack with条目 'entry.autogenerated.js'.

webpack export 类 from multiple entry files

webpack export classes from multiple entry files

javascript

ecmascript-6

webpack