在浏览器中获取 sourcemapped 源位置

Question

我有window.onerror 并发现了一些异常。但问题是堆栈跟踪位于从另一种语言（ClojureScript）编译的 JS 中。所以带有行号的堆栈跟踪是编译的形式。问题是：如何将堆栈转换为浏览器中的原始源？正如我们所见，浏览器已经能够在调试器中使用映射源。 （我们只使用 Chrome）

Answer 1

ClojureScript 确实支持源映射。默认情况下，ClojureScript 编译器将只为开发构建生成源映射文件。根据您的描述，您的 ClojureScript 文件已编译用于生产。 有两种方法可以解决您的问题：

• 为生产构建生成源映射，
• 为生产版本启用调试模式（推荐）。

为生产构建生成源映射

既然您要的是源地图，这里是获取它们的方法。 如果您有权访问源代码，则可以设置适当的编译器选项以启用生产构建的源映射：

• 如果您使用shadow-cljs，您可以在Compiler Options 文档中找到示例。
• 如果您使用cljsbuild，您可以在Source Maps 文档中找到示例。

这是在生产模式下启用源映射的最低配置：

• 对于shadow-cljs

{:builds {:app {:target  :browser
                :release {:compiler-options {:source-map true}}}}}

• 为cljsbuild

{:cljsbuild {:builds [{:id       "production"
                       :compiler {:optimizations :advanced
                                  :source-map    true}}]}}

为生产版本启用调试模式（推荐）

ClojureScript 编译器还有一个名为 :pseudo-names 的功能，旨在解决这个特定问题。 来自ClojureScript documentation：

更改您的生产版本以使用两个额外的（编译器）选项:pseudo-names true 和:pretty-print true。现在您的错误将显示与原始源中的名称相对应的名称。

同上，举个例子：

• 为cljsbuild

{:cljsbuild {:builds [{:id       "production-debug"
                       :compiler {:optimizations :advanced
                                  :pseudo-names  true
                                  :pretty-print  true}}]}}

• shadow-cljs可以直接运行：

shadow-cljs release app --debug

---

如果您无法访问源代码，最好直接向维护人员寻求帮助。 ClojureScript 生产构建模式生成紧凑的代码，旨在尽可能小且尽可能快，而不是人类阅读或调试。