Class export with Webpack and Babel not working

Question

I have a very simple setup with Webpack and Babel for a small library.

I used to have the following architecture for creating the ES5 library version:

module.exports.lib = (function () { /* private part of library here */ return { ... /* public part of library here */ } })(); 

Everything worked fine, and I even had some ES6 features, such as arrow functions inside my library, and it worked. However, I decided to change my approach to the ES6 class, so:

 export default class Library { } 

And now when I try to do:

 var library = new Library(); 

I realized that the library is not defined. Even just evaluating Library returns undefined.

So what I did was turn the file that uses the library into an ES6 file that makes import Library from 'libraryfile.js' , and it worked again.

However, I would really like to see my output library still be used from regular ES5 with the <script> , as before. Is it possible?

Here is my webpack configuration file:

 module.exports = { entry: { pentagine: "./lib/pentagine.js", demos: ["./demos/helicopter_game/PlayState.js"] }, output: { path: __dirname, filename: "./build/[name].js", libraryTarget: 'umd' }, module: { loaders: [ { test: /.js$/, loader: 'babel-loader', exclude: /node_modules/, query: { presets: ['es2015'] } } ] } }; 

Answer 1

The default export is stored in the default property of the module. If you want to make your library accessible, if users are not aware of it, you can change your web login file to

 module.exports = require('./libraryfile').default; 

Also, make sure you have library: 'YourLibraryName' in your web package configuration as per webpack.imtqy.com/docs/configuration.html#output-library.