在浏览器中获取 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:

Change your production build to use two additional (compiler) options :pseudo-names true and :pretty-print true. Now your error will show a name that corresponds to the name in the original source.

同上，举个例子：

• 对于cljsbuild

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

• 对于shadow-cljs，可以直接运行:

shadow-cljs release app --debug

---

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