Webpack umd library return Object.default

Question

I'm writing a lib with webpack with these settings:

output: {
    path: path.join('build'),
    filename: 'my_lib.js',
    library: 'MyLib',
    libraryTarget: 'umd'
  },

MyLib:

export default function() {
  console.log('MyLib');
}

The problem is, when I try to load the build/my_lib.js in a browser, the only way to access MyLib is through MyLib.default...

Any idea?

Answer 1

You should set libraryExport to default;

https://webpack.js.org/configuration/output/#outputlibraryexport

Answer 2

the key is to use libraryExport: "default" like this:

  module.exports = {
    entry: ...,
    output: {
      path: __dirname + "/dist/",
      filename: "Template.js",
      library: "Template",
      libraryTarget: "umd",
      libraryExport: "default",
      globalObject: "this",
    },