feat: add babel-loader debug logger (#1034)

src/cache.js

@@ -110,6 +110,7 @@ const handleCache = async function (directory, params) {
     cacheCompression,
     hash,
     getFileTimestamp,
+    logger,
   } = params;
 
   const file = path.join(
@@ -120,17 +121,23 @@ const handleCache = async function (directory, params) {
   try {
     // No errors mean that the file was previously cached
     // we just need to return it
+    logger.debug(`reading cache file '${file}'`);
     const result = await read(file, cacheCompression);
     if (
       !(await areExternalDependenciesModified(
         result.externalDependencies,
         getFileTimestamp,
       ))
     ) {
+      logger.debug(`validated cache file '${file}'`);
       return result;
     }
+    logger.debug(
+      `discarded cache file '${file}' due to changes in external dependencies`,
+    );
   } catch {
     // conitnue if cache can't be read
+    logger.debug(`discarded cache as it can not be read`);
   }
 
   const fallback =
@@ -139,6 +146,7 @@ const handleCache = async function (directory, params) {
   // Make sure the directory exists.
   try {
     // overwrite directory if exists
+    logger.debug(`creating cache folder '${directory}'`);
     await mkdir(directory, { recursive: true });
   } catch (err) {
     if (fallback) {
@@ -150,10 +158,12 @@ const handleCache = async function (directory, params) {
 
   // Otherwise just transform the file
   // return it to the user asap and write it in cache
+  logger.debug(`applying Babel transform`);
   const result = await transform(source, options);
   await addTimestamps(result.externalDependencies, getFileTimestamp);
 
   try {
+    logger.debug(`writing result to cache file '${file}'`);
     await write(file, cacheCompression, result);
   } catch (err) {
     if (fallback) {

src/index.js

@@ -53,6 +53,7 @@ function makeLoader(callback) {
 
 async function loader(source, inputSourceMap, overrides) {
   const filename = this.resourcePath;
+  const logger = this.getLogger("babel-loader");
 
   let loaderOptions = this.getOptions(schema);
 
@@ -70,17 +71,20 @@ async function loader(source, inputSourceMap, overrides) {
       );
     }
 
+    logger.debug(`loading customize override: '${loaderOptions.customize}'`);
     let override = require(loaderOptions.customize);
     if (override.__esModule) override = override.default;
 
     if (typeof override !== "function") {
       throw new Error("Custom overrides must be functions.");
     }
+    logger.debug("applying customize override to @babel/core");
     overrides = override(babel);
   }
 
   let customOptions;
   if (overrides && overrides.customOptions) {
+    logger.debug("applying overrides customOptions() to loader options");
     const result = await overrides.customOptions.call(this, loaderOptions, {
       source,
       map: inputSourceMap,
@@ -109,6 +113,7 @@ async function loader(source, inputSourceMap, overrides) {
     );
   }
 
+  logger.debug("normalizing loader options");
   // Standardize on 'sourceMaps' as the key passed through to Webpack, so that
   // users may safely use either one alongside our default use of
   // 'this.sourceMap' below without getting error about conflicting aliases.
@@ -145,12 +150,14 @@ async function loader(source, inputSourceMap, overrides) {
   delete programmaticOptions.cacheCompression;
   delete programmaticOptions.metadataSubscribers;
 
+  logger.debug("resolving Babel configs");
   const config = await babel.loadPartialConfigAsync(
     injectCaller(programmaticOptions, this.target),
   );
   if (config) {
     let options = config.options;
     if (overrides && overrides.config) {
+      logger.debug("applying overrides config() to Babel config");
       options = await overrides.config.call(this, config, {
         source,
         map: inputSourceMap,
@@ -177,6 +184,7 @@ async function loader(source, inputSourceMap, overrides) {
 
     let result;
     if (cacheDirectory) {
+      logger.debug("cache is enabled");
       const getFileTimestamp = promisify((path, cb) => {
         this._compilation.fileSystemInfo.getFileTimestamp(path, cb);
       });
@@ -192,15 +200,21 @@ async function loader(source, inputSourceMap, overrides) {
         cacheCompression,
         hash,
         getFileTimestamp,
+        logger,
       });
     } else {
+      logger.debug("cache is disabled, applying Babel transform");
       result = await transform(source, options);
     }
 
-    config.files.forEach(configFile => this.addDependency(configFile));
+    config.files.forEach(configFile => {
+      this.addDependency(configFile);
+      logger.debug(`added '${configFile}' to webpack dependencies`);
+    });
 
     if (result) {
       if (overrides && overrides.result) {
+        logger.debug("applying overrides result() to Babel transform results");
         result = await overrides.result.call(this, result, {
           source,
           map: inputSourceMap,
@@ -214,9 +228,11 @@ async function loader(source, inputSourceMap, overrides) {
 
       externalDependencies?.forEach(([dep]) => {
         this.addDependency(dep);
+        logger.debug(`added '${dep}' to webpack dependencies`);
       });
       metadataSubscribers.forEach(subscriber => {
         subscribe(subscriber, metadata, this);
+        logger.debug(`invoked metadata subscriber '${String(subscriber)}'`);
       });
 
       return [code, map];

test/cache.test.js

@@ -400,3 +400,34 @@ test("should cache result when there are external dependencies", async () => {
   assert.ok(stats.compilation.fileDependencies.has(dep));
   assert.strictEqual(counter, 2);
 });
+
+test("should output debug logs when stats.loggingDebug includes babel-loader", async () => {
+  const config = Object.assign({}, globalConfig, {
+    output: {
+      path: context.directory,
+    },
+    module: {
+      rules: [
+        {
+          test: /\.jsx?/,
+          loader: babelLoader,
+          exclude: /node_modules/,
+          options: {
+            cacheDirectory: true,
+            presets: ["@babel/preset-env"],
+          },
+        },
+      ],
+    },
+    stats: {
+      loggingDebug: ["babel-loader"],
+    },
+  });
+
+  const stats = await webpackAsync(config);
+
+  assert.match(
+    stats.toString(config.stats),
+    /normalizing loader options\n\s+resolving Babel configs\n\s+cache is enabled\n\s+reading cache file.+\n\s+discarded cache as it can not be read\n\s+creating cache folder.+\n\s+applying Babel transform\n\s+writing result to cache file.+\n\s+added '.+babel.config.json' to webpack dependencies/,
+  );
+});

test/loader.test.js

@@ -199,3 +199,20 @@ test("should track external dependencies", async () => {
   assert.ok(stats.compilation.fileDependencies.has(dep));
   assert.deepEqual(stats.compilation.warnings, []);
 });
+
+test("should output debug logs when stats.loggingDebug includes babel-loader", async () => {
+  const config = Object.assign({}, globalConfig, {
+    output: {
+      path: context.directory,
+    },
+    stats: {
+      loggingDebug: ["babel-loader"],
+    },
+  });
+
+  const stats = await webpackAsync(config);
+  assert.match(
+    stats.toString(config.stats),
+    /normalizing loader options\n\s+resolving Babel configs\n\s+cache is disabled, applying Babel transform/,
+  );
+});