exports-loader
Advanced tools
The exports-loader npm package allows you to add exports to your modules. This can be useful when you need to export specific variables or functions from a module that does not export them by default.
Exporting a single variable
This feature allows you to export a single variable from a module. In this example, the variable 'singleVar' from 'module.js' is exported.
module.exports = require('exports-loader?exports=singleVar!./module.js');Exporting multiple variables
This feature allows you to export multiple variables from a module. In this example, 'var1' and 'var2' from 'module.js' are exported.
module.exports = require('exports-loader?exports[]=var1&exports[]=var2!./module.js');Exporting a function
This feature allows you to export a function from a module. In this example, the function 'someFunction' from 'module.js' is exported.
module.exports = require('exports-loader?exports=someFunction!./module.js');The expose-loader package allows you to expose a module globally, making it available as a global variable. This is different from exports-loader, which focuses on exporting specific variables or functions from a module.
The imports-loader package allows you to inject variables into the scope of a module. This is useful for modifying the context of a module, whereas exports-loader is used for exporting specific variables or functions.
Allow to setup exports module.exports/export for source files.
Useful when a source file does not contain exports or something does not export.
For further hints on compatibility issues, check out Shimming of the official docs.
Warning
By default loader generate ES module named syntax.
Warning
Be careful, existing exports (
export/module.exports/exports) in the original code and exporting new values can cause a failure.
To begin, you'll need to install exports-loader:
npm install exports-loader --save-dev
or
yarn add -D exports-loader
or
pnpm add -D exports-loader
The | or %20 (space) allow to separate the syntax, name and alias of export.
The documentation and syntax examples can be read here.
Warning
%20is space in a query string, because you can't use spaces in URLs
Then add the loader to the desired import statement or require calls. For example:
import { myFunction } from "exports-loader?exports=myFunction!./file.js";
// Adds the following code to the file's source:
//
// ...
// Code
// ...
//
// export { myFunction }
myFunction("Hello world");
import {
myVariable,
myFunction,
} from "exports-loader?exports=myVariable,myFunction!./file.js";
// Adds the following code to the file's source:
//
// ...
// Code
// ...
//
// export { myVariable, myFunction };
const newVariable = myVariable + "!!!";
console.log(newVariable);
myFunction("Hello world");
const {
myFunction,
} = require("exports-loader?type=commonjs&exports=myFunction!./file.js");
// Adds the following code to the file's source:
//
// ...
// Code
// ...
//
// module.exports = { myFunction }
myFunction("Hello world");
// Alternative syntax:
// import myFunction from 'exports-loader?exports=default%20myFunction!./file.js';
import myFunction from "exports-loader?exports=default|myFunction!./file.js";
// `%20` is space in a query string, equivalently `default myFunction`
// Adds the following code to the file's source:
//
// ...
// Code
// ...
//
// exports default myFunction;
myFunction("Hello world");
const myFunction = require("exports-loader?type=commonjs&exports=single|myFunction!./file.js");
// `|` is separator in a query string, equivalently `single|myFunction`
// Adds the following code to the file's source:
//
// ...
// Code
// ...
//
// module.exports = myFunction;
myFunction("Hello world");
import { myFunctionAlias } from "exports-loader?exports=named|myFunction|myFunctionAlias!./file.js";
// `|` is separator in a query string, equivalently `named|myFunction|myFunctionAlias`
// Adds the following code to the file's source:
//
// ...
// Code
// ...
//
// exports { myFunction as myFunctionAlias };
myFunctionAlias("Hello world");
Description of string values can be found in the documentation below.
webpack.config.js
module.exports = {
module: {
rules: [
{
// You can use `regexp`
// test: /vendor\.js/$
test: require.resolve("./path/to/vendor.js"),
loader: "exports-loader",
options: {
exports: "myFunction",
},
},
],
},
};
And run webpack via your preferred method.
| Name | Type | Default | Description |
|---|---|---|---|
type | {String} | module | Format of generated exports |
exports | {String|Object|Array<String|Object>} | undefined | List of exports |
typeType: String
Default: module
Format of generated exports.
Possible values - commonjs (CommonJS module syntax) and module (ES module syntax).
commonjswebpack.config.js
module.exports = {
module: {
rules: [
{
test: require.resolve("./path/to/vendor.js"),
loader: "exports-loader",
options: {
type: "commonjs",
exports: "Foo",
},
},
],
},
};
Generate output:
// ...
// Code
// ...
module.exports = { Foo };
modulewebpack.config.js
module.exports = {
module: {
rules: [
{
test: require.resolve("./path/to/vendor.js"),
loader: "exports-loader",
options: {
type: "module",
exports: "Foo",
},
},
],
},
};
Generate output:
// ...
// Code
// ...
export { Foo };
exportsType: String|Array
Default: undefined
List of exports.
StringAllows to use a string to describe an export.
SyntaxThe | or %20 (space) allow to separate the syntax, name and alias of export.
String syntax - [[syntax] [name] [alias]] or [[syntax]|[name]|[alias]], where:
[syntax] (may be omitted) -
type is module- can be default and named,type is commonjs- can be single and multiple[name] - name of an exported value (required)
[alias] - alias of an exported value (may be omitted)
Examples:
[Foo] - generates export { Foo };.[default Foo] - generates export default Foo;.[named Foo] - generates export { Foo };.[named Foo FooA] - generates export { Foo as FooA };.[single Foo] - generates module.exports = Foo;.[multiple Foo] - generates module.exports = { Foo };.[multiple Foo FooA] - generates module.exports = { 'FooA': Foo };.[named [name] [name]Alias] - generates ES module named exports and exports a value equal to the filename under other name., for single.js it will be single and singleAlias, generates export { single as singleAlias };.Warning
You need to set
type: "commonjs"to usesingleormultiplesyntaxes.
Warning
Aliases can't be used together with
defaultorsinglesyntaxes.
webpack.config.js
module.exports = {
module: {
rules: [
{
test: require.resolve("./path/to/vendor.js"),
loader: "exports-loader",
options: {
exports: "default Foo",
},
},
],
},
};
Generate output:
// ...
// Code
// ...
export default Foo;
webpack.config.js
module.exports = {
module: {
rules: [
{
test: require.resolve("./path/to/vendor.js"),
loader: "exports-loader",
options: {
exports: "named Foo FooA",
},
},
],
},
};
Generate output:
// ...
// Code
// ...
export { Foo as FooA };
webpack.config.js
module.exports = {
module: {
rules: [
{
test: require.resolve("./path/to/vendor.js"),
loader: "exports-loader",
options: {
type: "commonjs",
exports: "single Foo",
},
},
],
},
};
Generate output:
// ...
// Code
// ...
module.exports = Foo;
webpack.config.js
module.exports = {
module: {
rules: [
{
test: require.resolve("./path/to/vendor.js"),
loader: "exports-loader",
options: {
type: "commonjs",
exports: "multiple Foo FooA",
},
},
],
},
};
Generate output:
// ...
// Code
// ...
module.exports = { FooA: Foo };
ObjectAllows to use an object to describe an export.
Properties:
syntax - can be default or named for the module type (ES modules module format), and single or multiple for the commonjs type (CommonJS module format) (may be omitted)name - name of an exported value (required)alias - alias of an exported value (may be omitted)webpack.config.js
module.exports = {
module: {
rules: [
{
test: require.resolve("./path/to/vendor.js"),
loader: "exports-loader",
options: {
exports: {
syntax: "default",
name: "Foo",
},
},
},
],
},
};
Generate output:
// ...
// Code
// ...
export default Foo;
webpack.config.js
module.exports = {
module: {
rules: [
{
test: require.resolve("./path/to/vendor.js"),
loader: "exports-loader",
options: {
exports: {
syntax: "named",
name: "Foo",
alias: "FooA",
},
},
},
],
},
};
Generate output:
// ...
// Code
// ...
export { Foo as FooA };
webpack.config.js
module.exports = {
module: {
rules: [
{
test: require.resolve("./path/to/vendor.js"),
loader: "exports-loader",
options: {
type: "commonjs",
exports: {
syntax: "single",
name: "Foo",
},
},
},
],
},
};
Generate output:
// ...
// Code
// ...
module.exports = Foo;
webpack.config.js
module.exports = {
module: {
rules: [
{
test: require.resolve("./path/to/vendor.js"),
loader: "exports-loader",
options: {
type: "commonjs",
exports: {
syntax: "multiple",
name: "Foo",
alias: "FooA",
},
},
},
],
},
};
Generate output:
// ...
// Code
// ...
module.exports = { FooA: Foo };
ArrayAllow to specify multiple exports. Each item can be a string or an object.
Warning
Not possible to use
singleandmultiplesyntaxes together due to CommonJS format limitations.
Warning
Not possible to use multiple
defaultvalues due to ES module format limitations.
Warning
Not possible to use multiple
singlevalues due to CommonJS format limitations.
webpack.config.js
module.exports = {
module: {
rules: [
{
test: require.resolve("./path/to/vendor.js"),
loader: "exports-loader",
options: {
type: "commonjs",
exports: ["Foo", "multiple Bar", "multiple Baz BazA"],
},
},
],
},
};
Generate output:
// ...
// Code
// ...
module.exports = { Foo, Bar, BazA: Bar };
webpack.config.js
module.exports = {
module: {
rules: [
{
test: require.resolve("./path/to/vendor.js"),
loader: "exports-loader",
options: {
exports: ["default Foo", "named Bar BarA"],
},
},
],
},
};
Generate output:
// ...
// Code
// ...
export default Foo;
export { Bar as BarA };
webpack.config.js
module.exports = {
module: {
rules: [
{
test: require.resolve("./path/to/vendor.js"),
loader: "exports-loader",
options: {
exports: [
{ syntax: "named", name: "Foo", alias: "FooA" },
{ syntax: "named", name: "Bar" },
"Baz",
],
},
},
],
},
};
Generate output:
// ...
// Code
// ...
export { Foo as FooA, Bar, Baz };
Please take a moment to read our contributing guidelines if you haven't yet done so.
FAQs
exports loader module for webpack
The npm package exports-loader receives a total of 244,715 weekly downloads. As such, exports-loader popularity was classified as popular.
We found that exports-loader demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 3 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Research
/Security News
Ongoing npm supply chain attack spreads to DuckDB: multiple packages compromised with the same wallet-drainer malware.
Security News
The MCP Steering Committee has launched the official MCP Registry in preview, a central hub for discovering and publishing MCP servers.
Product
Socket’s new Pull Request Stories give security teams clear visibility into dependency risks and outcomes across scanned pull requests.