Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Webpack config to expose bundle in a variable in the global context
<html>
<head>
</head>
<body>
<script src="lib/yourlib.js"></script>
<script>
window.onload = function () {
EntryPoint.run();
};
</script>
</body>
</html>
module.exports = {
run: function () {
console.log('run from library');
}
};
{
"name": "test-webpack-library",
"version": "1.0.0",
"description": "",
"main": "./lib/yourlib.js",
"scripts": {
"build": "webpack"
},
"keywords": [],
"author": "",
"license": "MIT"
}
var webpack = require('webpack');
module.exports = {
entry: './index.js',
output: {
path: './lib',
filename: 'yourlib.js',
libraryTarget: 'var',
library: 'EntryPoint'
}
};
@darkworks

This comment has been minimized.

Copy link

@darkworks darkworks commented Dec 27, 2017

not working getting
Uncaught ReferenceError: EntryPoint is not defined

@nbpalomino

This comment has been minimized.

Copy link

@nbpalomino nbpalomino commented May 14, 2018

Any solution ? Im getting the same as @darkworks with webpack 3

@caroso1222

This comment has been minimized.

Copy link

@caroso1222 caroso1222 commented May 27, 2018

I got this working with the following config:

module.exports = {
  entry: './index.js',
  output: {
    path: './lib',
    filename: 'yourlib.js',
    libraryTarget: 'umd',
    library: 'YourLibraryName',
    umdNamedDefine: true,
	libraryExport: 'default'
  }
};

The libraryExport is needed if you want to expose the default export of your module, but you can set it a named export as well. In this case I had an export default class Foo that I wanted to expose, so I just set the export to default.

See more information about the output configs here.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment