我可以在 chrome 扩展中启用源映射吗？

Question

我正在做一些测试开发并使用 Svelte 和 ParcelJS 创建一个 Chrome 扩展，并希望在 chrome 开发工具中查看源映射。但是，在查看任何页面时，我只能看到捆绑的代码，看到此错误：

DevTools 无法加载 SourceMap：无法加载 chrome-extension://debafkiakedogoflaalmbbfbbccnfbib/Background/index.js.map 的内容：HTTP 错误：状态代码 404，net::ERR_UNKNOWN_URL_SCHEME

似乎加载程序不喜欢chrome-extensionurl 方案。我已经尝试将“dist”添加为覆盖目录，但是无论加载什么源映射似乎都会忽略它并仍然使用“chrome-extension”方案。

我可以通过手动将 url 更改为另一个模式（file:///url 或在 dist 目录中运行简单的 http 服务器并使用http://url）来使其工作：

//# sourceMappingURL=file:///c:/git/svelte-extension/dist//Background/index.js.map`
//# sourceMappingURL=http://localhost:8080/Background/index.js.map`

有没有办法让chrome覆盖目录或告诉parcel创建这些url？

Answer 1

尝试在开发过程中使用内联源映射。Chrome 不会加载 Chrome 扩展源映射文件，但内联源映射可以工作。

背景

Chrome 总是默默地无法从chrome-extension://URL 方案加载源映射文件。Chrome v80开始报告DevTools failed to load SourceMap错误。

这可能很快会改变，因为有一个修复工作。一些安全问题阻碍了这一点，所以请保持手指交叉。

以下是跟踪此问题的两个相关 Chromium 错误：

1. https://bugs.chromium.org/p/chromium/issues/detail?id=1052872#c14
2. https://bugs.chromium.org/p/chromium/issues/detail?id=1053535