chore: Generate source maps in the development environment (#14876)

Gulpfile.mjs

@@ -245,6 +245,8 @@ function createWorker(useWorker) {
 }
 
 async function buildBabel(useWorker, ignore = []) {
+  const enableSourceMap = !process.env.IS_PUBLISH;
+
   const worker = createWorker(useWorker);
   const files = await new Promise((resolve, reject) => {
     glob(
@@ -263,13 +265,27 @@ async function buildBabel(useWorker, ignore = []) {
   for (const file of files) {
     // @example ./packages/babel-parser/src/index.js
     const dest = "./" + mapSrcToLib(file.slice(2));
-    promises.push(worker.transform(file, dest));
+    promises.push(
+      worker.transform(file, dest, { sourceMaps: enableSourceMap })
+    );
   }
-  return Promise.allSettled(promises).finally(() => {
-    if (worker.end !== undefined) {
-      worker.end();
-    }
-  });
+  return Promise.allSettled(promises)
+    .then(results => {
+      results.forEach(result => {
+        if (result.status == "rejected") {
+          if (process.env.WATCH_SKIP_BUILD) {
+            console.error(result.reason);
+          } else {
+            throw result.reason;
+          }
+        }
+      });
+    })
+    .finally(() => {
+      if (worker.end !== undefined) {
+        worker.end();
+      }
+    });
 }
 
 /**

babel-worker.cjs

@@ -1,6 +1,6 @@
 const { transformAsync } = require("@babel/core");
 const { mkdirSync, statSync, readFileSync, writeFileSync } = require("fs");
-const { dirname } = require("path");
+const path = require("path");
 const { log } = require("./scripts/utils/logger.cjs");
 
 let chalk;
@@ -20,26 +20,40 @@ function needCompile(src, dest) {
     }
   }
   const srcStat = statSync(src);
-  return srcStat.mtimeMs > destStat.mtimeMs;
+  return srcStat.mtimeMs >= destStat.mtimeMs;
 }
 
-exports.transform = async function transform(src, dest) {
+exports.transform = async function transform(src, dest, opts = {}) {
   if (!chalk) await chalkP;
 
-  mkdirSync(dirname(dest), { recursive: true });
+  mkdirSync(path.dirname(dest), { recursive: true });
   if (!needCompile(src, dest)) {
     return;
   }
   log(`Compiling '${chalk.cyan(src)}'...`);
   const content = readFileSync(src, { encoding: "utf8" });
-  const { code } = await transformAsync(content, {
+  const { code, map } = await transformAsync(content, {
     filename: src,
+    sourceFileName: `../src/${path.basename(src)}`,
     caller: {
       // We have wrapped packages/babel-core/src/config/files/configuration.js with feature detection
       supportsDynamicImport: true,
       name: "babel-worker",
     },
+    ...opts,
   });
 
-  writeFileSync(dest, code, "utf8");
+  if (map) {
+    writeFileSync(
+      dest,
+      `${code}
+
+//# sourceMappingURL=${path.basename(dest)}.map
+`,
+      "utf8"
+    );
+    writeFileSync(dest + ".map", JSON.stringify(map), "utf8");
+  } else {
+    writeFileSync(dest, code, "utf8");
+  }
 };