Chrome 不请求 JS 源映射，但 Firefox 请求

Posted 2023-03-07

【中文标题】Chrome 不请求 JS 源映射，但 Firefox 请求

【英文标题】：Chrome not requesting JS source map, but Firefox does

【发布时间】：2016-08-24 01:48:33

【问题描述】：

我正在使用 webpack 使用 devtool: 'source-map' 选项构建我的客户端 JS，所以我的 JS 包以 //# sourceMappingURL=app.bundle.js.map 结尾。当我打开 chrome devtools 时，Chrome 会显示“检测到源地图”横幅，但实际上并未在导航器中显示原始源。我的服务器访问日志没有显示对源映射的任何请求。

当我使用 Firefox 开发工具打开同一页面时，它会完全按预期加载源映射。

所有其他资产加载正常。清除我的浏览器缓存没有帮助。

有人经历过吗？这是 Chrome 的错误吗？

【问题讨论】：

刚刚发生在我身上。我关闭了我的控制台（这结束了我正在进行的暂停/中断，但这对我来说没问题），然后重新打开我的控制台，映射的源按预期显示。我没有将此作为“答案”提供，因为我不知道原始问题的原因，也不知道如何在不离开暂停/断点的情况下显示映射的源。

【参考方案1】：

我在Google Chrome v53 上仔细检查了它，无论响应状态是 200 还是 404，它都不会记录任何与 sourcemap 相关的请求（网络选项卡/控制台）。这意味着您需要确保您的网络服务器是正确提供文件。为此，您可以简单地在浏览器中打开 sourcemap url，例如

//# sourceMappingURL=sourcefile.js.map

localhost:3000/path/to/your/sourcefile.js.map

作为替代方案，您可以更改构建，以便将源映射内联在 js 文件中。那么你就不需要从服务器获取它了。

//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uI...