Skip to content

Commit 2ad6a8b

Browse files
kinseyostskipjack
authored andcommitted
docs(plugins): add EvalSourceMapDevToolPlugin docs (#1776)
1 parent 69b84ff commit 2ad6a8b

File tree

2 files changed

+77
-0
lines changed

2 files changed

+77
-0
lines changed
Lines changed: 76 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,76 @@
1+
---
2+
title: EvalSourceMapDevToolPlugin
3+
contributors:
4+
- johnnyreilly
5+
- simon04
6+
- kinseyost
7+
related:
8+
- title: Building Eval Source Maps
9+
url: https://survivejs.com/webpack/building/source-maps/#sourcemapdevtoolplugin-and-evalsourcemapdevtoolplugin
10+
---
11+
12+
This plugin enables more fine grained control of source map generation. It is an alternative to the [`devtool`](/configuration/devtool/) configuration option.
13+
14+
``` js
15+
new webpack.EvalSourceMapDevToolPlugin(options)
16+
```
17+
18+
19+
## Options
20+
21+
The following options are supported:
22+
23+
- `test` (`string|regex|array`): Include source maps for modules based on their extension (defaults to `.js` and `.css`).
24+
- `include` (`string|regex|array`): Include source maps for module paths that match the given value.
25+
- `exclude` (`string|regex|array`): Exclude modules that match the given value from source map generation.
26+
- `filename` (`string`): Defines the output filename of the SourceMap (will be inlined if no value is provided).
27+
- `append` (`string`): Appends the given value to the original asset. Usually the `#sourceMappingURL` comment. `[url]` is replaced with a URL to the source map file. `false` disables the appending.
28+
- `moduleFilenameTemplate` (`string`): See [`output.devtoolModuleFilenameTemplate`](/configuration/output/#output-devtoolmodulefilenametemplate).
29+
- `sourceURLTemplate`: Define the sourceURL default: `webpack-internal:///${module.identifier}`
30+
- `module` (`boolean`): Indicates whether loaders should generate source maps (defaults to `true`).
31+
- `columns` (`boolean`): Indicates whether column mappings should be used (defaults to `true`).
32+
- `protocol` (`string`): Allows user to override default protocol (`webpack-internal://`)
33+
34+
T> Setting `module` and/or `columns` to `false` will yield less accurate source maps but will also improve compilation performance significantly.
35+
36+
37+
## Examples
38+
39+
The following examples demonstrate some common use cases for this plugin.
40+
41+
### Exclude Vendor Maps
42+
43+
The following code would exclude source maps for any modules in the `vendor.js` bundle:
44+
45+
``` js
46+
new webpack.EvalSourceMapDevToolPlugin({
47+
filename: '[name].js.map',
48+
exclude: ['vendor.js']
49+
})
50+
```
51+
52+
### Setting sourceURL
53+
54+
Set a URL for source maps. Useful for avoiding cross-origin issues such as:
55+
56+
``` bash
57+
A cross-origin error was thrown. React doesn't have access to the actual error object in development. See https://fb.me/react-crossorigin-error for more information.
58+
```
59+
60+
The option can be set to a function:
61+
62+
``` js
63+
new webpack.EvalSourceMapDevToolPlugin({
64+
sourceURLTemplate: module => `/${module.identifier}`
65+
})
66+
```
67+
68+
Or a substition string:
69+
70+
``` js
71+
new webpack.EvalSourceMapDevToolPlugin({
72+
sourceURLTemplate: '[all-loaders][resource]'
73+
})
74+
```
75+
76+

src/content/plugins/index.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -35,6 +35,7 @@ Name | Description
3535
[`NpmInstallWebpackPlugin`](/plugins/npm-install-webpack-plugin) | Auto-install missing dependencies during development
3636
[`ProvidePlugin`](/plugins/provide-plugin) | Use modules without having to use import/require
3737
[`SourceMapDevToolPlugin`](/plugins/source-map-dev-tool-plugin) | Enables a more fine grained control of source maps
38+
[`EvalSourceMapDevToolPlugin`](/plugins/eval-source-map-dev-tool-plugin) | Enables a more fine grained control of eval source maps
3839
[`UglifyjsWebpackPlugin`](/plugins/uglifyjs-webpack-plugin) | Enables control of the version of UglifyJS in your project
3940
[`ZopfliWebpackPlugin`](/plugins/zopfli-webpack-plugin) | Prepare compressed versions of assets with node-zopfli
4041

0 commit comments

Comments
 (0)