Firefox：如何为 Web 扩展提供源映射

Question

我正在开发一个基于打字稿的网络扩展。为了调试，我需要源映射，包括后台和内容脚本。

目前，我正在使用 parcel to bundle my extension (but I don't think this problem is related to parcel). With the plugin 进行网络扩展，捆绑过程变得像 parcel build src/manifest.json 一样简单。

这还会编译打字稿并创建适当的源映射。我可以看到内容脚本的源映射并使用它们进行调试。但是在后台，没有加载 sourcemaps。

Firefox 抱怨：

Source map error: TypeError: NetworkError when attempting to fetch resource.
Resource URL: moz-extension://aabd65f9-70d4-43bc-afb8-d04b6eca3602/background.js
Source Map URL: /background.map[Learn More]

所以在我看来，好像这是向浏览器提供源映射的一些问题。我可以看到它已创建。它已为 contentscript 正确加载。而且我可以看到这两个脚本的语法是相同的。也许 Firefox 需要一种不同的后台托管方式？

为了重现这个问题，我设置了这个存储库：https://github.com/lhk/webextension_typescript_webpack

npm install -g parcel-bundler
git clone https://github.com/lhk/webextension_typescript_webpack
git checkout parcel_branch
npm install
parcel build src/manifest.json

然后将其加载到 Firefox 中并观察调试控制台输出。它会产生上述错误消息。

更新： 我发现了这个问题：https://github.com/webextension-toolbox/webextension-toolbox/issues/58

显然，Firefox 在处理 webextensions 时只能处理一组特定的 sourcemaps。但我不明白为什么源地图适用于内容脚本。

Answer 1

我已经将此作为对我的问题的更新附加，但实际上我认为这是一个答案。

github 上存在描述此问题的问题。最终评论仍然是最新的：https://github.com/webpack/webpack/issues/1194#issuecomment-402494524

问题是 firefox 中的错误。 Mozilla 也已提交错误报告：https://bugzilla.mozilla.org/show_bug.cgi?id=1437937

Firefox：如何为 Web 扩展提供源映射

Firefox: how to serve sourcemaps for web extension

javascript

typescript

npm

firefox-addon-webextensions

parceljs