I'm trying to build a js library written in es6 in a bundle. For modules, import / export is used and the preset es2015 Lieb has the following structure.

./src/ Unit1.js Unit2.js ... UnitN.js Entry.js //Точка входа

At the entry point I collect exported classes in the namespace.

 import A from 'MyLib/Unit1.js' import B from 'MyLib/Unit3.js' import C from 'MyLib/UnitN.js' export default { A: A, B: B, C: C };

webpack config:

 { context: lib_path, entry: './Entry.js', output: { path: `${__dirname}/dist`, filename: 'bundle.js', library: 'MyLib' }, module: { loaders: [{ test: /.js$/, loader: 'babel-loader', query: { presets: ['es2015'] } }] }, resolve: { root: lib_path, alias: { MyLib: './' } } }

The problem is the following. I can define the namespace in the webpack config (output.library), but then to refer to the library classes I need to use the constructions MyLib.default.A. I would like to exclude the word default .

    1 answer 1

    In general, apparently the webpack cuts nothing, and you just need to correctly apply the syntax of es6-modules.

    Here is a very detailed article in English.

    We do not need the default export, we need the named exports, so we simply remove the word default:

     export { A: A, B: B, C: C };

    And now we see this, and we understand that we can apply an es6-feature which allows us to briefly declare such objects and write just

     export {A, B, C}

    Actually, this export format can be seen very often. Where they prefer to export the module in one place and not in pieces.