diff --git a/build/ninja_gen/src/node.rs b/build/ninja_gen/src/node.rs
index ff9070e78..f3beb3f42 100644
--- a/build/ninja_gen/src/node.rs
+++ b/build/ninja_gen/src/node.rs
@@ -150,6 +150,7 @@ impl BuildAction for EsbuildScript<'_> {
         build.add_inputs("script", &self.script);
         build.add_inputs("entrypoint", &self.entrypoint);
         build.add_inputs("", inputs!["yarn.lock", ":node_modules", &self.deps]);
+        build.add_inputs("", inputs!["out/env"]);
         let stem = self.output_stem;
         let mut outs = vec![format!("{stem}.js")];
         outs.extend(self.extra_exts.iter().map(|ext| format!("{stem}.{ext}")));
diff --git a/ninja b/ninja
index 78b3ae2c6..9699f7a57 100755
--- a/ninja
+++ b/ninja
@@ -8,7 +8,7 @@ else
     out="$BUILD_ROOT"
 fi
 export CARGO_TARGET_DIR=$out/rust
-export RECONFIGURE_KEY="${MAC_X86};"
+export RECONFIGURE_KEY="${MAC_X86};${SOURCEMAP}"
 
 # separate build+run steps so build env doesn't leak into subprocesses
 cargo build -p runner
diff --git a/tools/ts-run b/tools/ts-run
index 25bc53c9c..9e36e6096 100755
--- a/tools/ts-run
+++ b/tools/ts-run
@@ -3,4 +3,4 @@
 # The pages can be accessed by, eg surfing to
 # http://localhost:40000/_anki/pages/deckconfig.html
 
-QTWEBENGINE_REMOTE_DEBUGGING=8080 ANKI_API_PORT=40000 ./run $*
+QTWEBENGINE_REMOTE_DEBUGGING=8080 ANKI_API_PORT=40000 SOURCEMAP=1 ./run $*
diff --git a/ts/bundle_svelte.mjs b/ts/bundle_svelte.mjs
index 03d948335..6c7522c57 100644
--- a/ts/bundle_svelte.mjs
+++ b/ts/bundle_svelte.mjs
@@ -20,6 +20,27 @@ if (page_html != null) {
 // support Qt 5.14
 const target = ["es6", "chrome77"];
 const inlineCss = bundle_css == null;
+const sourcemap = env.SOURCEMAP && true;
+let sveltePlugins;
+
+if (!sourcemap) {
+    sveltePlugins = [
+        // use esbuild for faster typescript transpilation
+        typescript({
+            target,
+            define: {
+                "process.browser": "true",
+            },
+            tsconfig: "ts/tsconfig.json",
+        }),
+        sveltePreprocess({ typescript: false }),
+    ];
+} else {
+    sveltePlugins = [
+        // use tsc for more accurate sourcemaps
+        sveltePreprocess({ typescript: true, sourceMap: true }),
+    ];
+}
 
 build({
     bundle: true,
@@ -29,21 +50,12 @@ build({
     minify: env.RELEASE && true,
     loader: { ".svg": "text" },
     preserveSymlinks: true,
-    sourcemap: false,
+    sourcemap: sourcemap ? "inline" : false,
     plugins: [
         sassPlugin({ loadPaths: [".", "node_modules"] }),
         sveltePlugin({
             compilerOptions: { css: inlineCss },
-            preprocess: [
-                typescript({
-                    target,
-                    define: {
-                        "process.browser": "true",
-                    },
-                    tsconfig: "ts/tsconfig.json",
-                }),
-                sveltePreprocess({ typescript: false }),
-            ],
+            preprocess: sveltePlugins,
         }),
     ],
     target,
diff --git a/ts/bundle_ts.mjs b/ts/bundle_ts.mjs
index d2b300e4c..0ad5ff0db 100644
--- a/ts/bundle_ts.mjs
+++ b/ts/bundle_ts.mjs
@@ -14,6 +14,7 @@ build({
     entryPoints: [entrypoint],
     outfile: bundle_js,
     minify: env.RELEASE && true,
+    sourcemap: env.SOURCEMAP ? "inline" : false,
     preserveSymlinks: true,
     target,
 }).catch(() => process.exit(1));