SourceMapDevToolPlugin

    支持以下选项：

    • test (string|regex|array)：包含基于扩展名的模块的 source map（默认是 .js, .mjs 和 .css）。
    • include (string|regex|array)：使路径与该值匹配的模块生成 source map。
    • exclude (string|regex|array)：使匹配该值的模块不生成 source map。
    • filename (string)：定义生成的 source map 的名称（如果没有值将会变成 inlined）。
    • moduleFilenameTemplate (string): 查看 output.devtoolModuleFilenameTemplate.
    • fallbackModuleFilenameTemplate (string)：同上。
    • module ()：表示 loader 是否生成 source map（默认为 true）。
    • columns (boolean)：表示是否应该使用 column mapping（默认为 true）。
    • lineToLine (boolean 或 object)：通过行到行源代码映射(line to line source mappings)简化和提升匹配模块的源代码映射速度。
    • noSources (boolean)：防止源文件的内容被包含在 source map 里（默认为 false）。
    • publicPath (string)：生成带 public path 前缀的绝对 URL，例如：https://example.com/project/。
    • fileContext (string)：使得 [file] 参数作为本目录的相对路径。

    lineToLine 对象允许的值和上面 test，include，exclude 选项一样。

    fileContext 选项在你想要将 source maps 存储到上层目录，避免 ../../ 出现在绝对路径 里面时有用。

    用法

    下面的示例展示了本插件的一些常见用例。

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

    1. module.exports = {
    2.   // ...
    3.   devtool: false,
    4.     new webpack.SourceMapDevToolPlugin({})
    5.   ]
    6. };

    以下代码会排除 vendor.js 内模块的 source map。

    1. new webpack.SourceMapDevToolPlugin({
    2.   append: '\n//# sourceMappingURL=http://example.com/sourcemap/[url]',
    3.   filename: '[name].map'
    4. });

    还有一种场景，source map 存储在上层目录中时：

    如下设置：

    1. new webpack.SourceMapDevToolPlugin({
    2.   filename: 'sourcemaps/[file].map',
    3.   publicPath: 'https://example.com/project/',

    将会生成以下 URL：

    johnnyreilly johnnyreilly simon04 simon04