我可以将 webpack 源映射和源代码文件放在不同的文件夹中吗？答案

【问题标题】：Can I place webpack source maps and source code files in seprate folders?我可以将 webpack 源映射和源代码文件放在不同的文件夹中吗？
【发布时间】：2017-03-27 16:52:31
【问题描述】：

我读到了这个问题source maps files in production - is it safe?。我想用源代码在不同的文件夹中生成源映射文件。有没有办法用 webpack 做到这一点？我还阅读了这个线程Relative SourceMap paths for debugging in WebStorm 并进行了测试，但又失败了。

【问题讨论】：

您的意思是 bunldes 和地图吗？

标签： webpack source-maps

【解决方案1】：

你可以像这样使用output.sourceMapFilename：

output: {
    filename: "bundles/[name].[chunkhash].min.js",
    sourceMapFilename: 'maps/[name].[chunkhash].map.js'
},

然后仅从bundles 文件夹提供服务。

【讨论】：

哦，非常感谢。非常好的答案，我相信我需要从头开始阅读 webpack 指南......
伊万感谢您的回答。也许您可以通过添加指向docs 的链接来做得更好。

【解决方案2】：

正如 Ivan 所写，解决方案是使用 output.sourceMapFilename

但是，webpack doc 推荐的解决方案是仅使用 [file] 占位符（默认值为 [file].map）。

然后最好将值定义如下：

output: {
    filename: 'js/[name]-[chunkhash].js',
    sourceMapFilename: 'sourceMap/[file].map'
},

然后您将保留结构，它也适用于 css sourceMaps

【讨论】：

我觉得这个建议非常重要，因为源映射文件名必须与缩小文件中引用的内容匹配。