SourceMapDevToolPlugin#

This plugin enables more fine grained control of source map generation. It is also enabled automatically by certain settings of the devtool configuration option.

new rspack.SourceMapDevToolPlugin(options);

Options#

test#

• Type: string RegExp [string, RegExp]

Include source maps for modules based on their extension (defaults to .js, .mjs, and .css).

include#

• Type: string RegExp [string, RegExp]

Include source maps for module paths that match the given value.

exclude#

• Type: string RegExp [string, RegExp]

Exclude modules that match the given value from source map generation.

filename#

• Type: string

Defines the output filename of the SourceMap (will be inlined if no value is provided).

append#

• Type: string function

Appends the given value to the original asset. Usually the #sourceMappingURL comment. [url] is replaced with a URL to the source map file. Path parameters are supported: [chunk], [filename] and [contenthash]. Setting append to false disables the appending.

moduleFilenameTemplate#

• Type: string

See output.devtoolModuleFilenameTemplate.

fallbackModuleFilenameTemplate#

• Type: string

See link above.

namespace#

• Type: string

See output.devtoolNamespace.

module#

• Type: boolean
• Default: true

Indicates whether loaders should generate source maps.

columns#

• Type: boolean
• Default: true

Indicates whether column mappings should be used.

noSources#

• Type: boolean
• Default: false

Prevents the source file content from being included in the source map.

publicPath#

• Type: string

Emits absolute URLs with public path prefix, e.g. https://example.com/project/.

fileContext#

• Type: string

Makes the [file] argument relative to this directory.

The fileContext option is useful when you want to store source maps in an upper level directory to avoid ../../ appearing in the absolute [url].

sourceRoot#

• Type: string

Provide a custom value for the sourceRoot property in the SourceMap.

Examples#

The following examples demonstrate some common use cases for this plugin.

Basic Use Case#

You can use the following code to replace the configuration option devtool: inline-source-map with an equivalent custom plugin configuration:

module.exports = {
  // ...
  devtool: false,
  plugins: [new rspack.SourceMapDevToolPlugin({})],
};

Exclude Vendor Maps#

The following code would exclude source maps for any modules in the vendor.js bundle:

new rspack.SourceMapDevToolPlugin({
  filename: '[file].map[query]',
  exclude: ['vendor.js'],
});

Host Source Maps Externally#

Set a URL for source maps. Useful for hosting them on a host that requires authorization.

new rspack.SourceMapDevToolPlugin({
  append: '\n//# sourceMappingURL=https://example.com/sourcemap/[url]',
  filename: '[file].map[query]',
});

And for cases when source maps are stored in the upper level directory:

With the following config:

new rspack.SourceMapDevToolPlugin({
  filename: 'sourcemaps/[file].map',
  publicPath: 'https://example.com/project/',
  fileContext: 'public',
});

Will produce the following URL: