expose loader module for webpack
This module requires a minimum of Node v6.9.0 and Webpack v4.0.0.
To begin, you'll need to install expose-loader
:
$ npm install expose-loader --save-dev
Then add the loader to your webpack
config. For example:
// webpack.config.js
module.exports = {
module: {
rules: [
{
test: /.js/,
use: [
{
loader: `expose-loader`,
options: {...options}
}
]
}
]
}
}
And then require the target file in your bundle's code:
// src/entry.js
require("expose-loader?libraryName!./thing.js");
And run webpack
via your preferred method.
For example, let's say you want to expose jQuery as a global called $
:
require("expose-loader?$!jquery");
Thus, window.$
is then available in the browser console.
Alternately, you can set this in your config file:
// webpack.config.js
module: {
rules: [{
test: require.resolve('jquery'),
use: [{
loader: 'expose-loader',
options: '$'
}]
}]
}
Let's say you also want to expose it as window.jQuery
in addition to window.$
.
For multiple expose you can use !
in loader string:
// webpack.config.js
module: {
rules: [{
test: require.resolve('jquery'),
use: [{
loader: 'expose-loader',
options: 'jQuery'
},{
loader: 'expose-loader',
options: '$'
}]
}]
}
The require.resolve
call is a Node.js function (unrelated to require.resolve
in webpack
processing). require.resolve
gives you the
absolute path to the module ("/.../app/node_modules/react/react.js"
). So the
expose only applies to the react module. And it's only exposed when used in the
bundle.
Please take a moment to read our contributing guidelines if you haven't yet done so.