refactor: external command logic

Author: alexander-akait

.gitignore

@@ -16,6 +16,7 @@
 # Node dependencies
 node_modules
 test/**/node_modules
+!test/external-command/node_modules
 
 # Lock files
 yarn.lock

packages/webpack-cli/src/webpack-cli.ts

@@ -100,7 +100,6 @@ interface CommandOptions<
   usage?: string;
   dependencies?: string[];
   pkg?: string;
-  external?: boolean;
   preload?: () => Promise<C>;
   options?:
     | CommandOption[]
@@ -543,13 +542,13 @@ class WebpackCLI {
 
   async makeCommand<A = void, O extends CommanderArgs = CommanderArgs, C extends Context = Context>(
     options: CommandOptions<A, O, C>,
-  ): Promise<Command | undefined> {
+  ): Promise<Command> {
     const alreadyLoaded = this.program.commands.find(
       (command) => command.name() === options.rawName,
     );
 
     if (alreadyLoaded) {
-      return;
+      return alreadyLoaded as Command;
     }
 
     const command = this.program.command(options.name, {
@@ -1163,9 +1162,7 @@ class WebpackCLI {
       } else {
         const [name] = options;
 
-        await this.#loadCommandByName(name);
-
-        const command = this.#findCommandByName(name);
+        const command = await this.#loadCommandByName(name);
 
         if (!command) {
           const builtInCommandUsed = Object.values(this.#commands).find(
@@ -1202,9 +1199,9 @@ class WebpackCLI {
         outputIncorrectUsageOfHelp();
       }
 
-      await this.#loadCommandByName(commandName);
-
-      const command = isGlobalOption(optionName) ? program : this.#findCommandByName(commandName);
+      const command = isGlobalOption(optionName)
+        ? program
+        : await this.#loadCommandByName(commandName);
 
       if (!command) {
         this.logger.error(`Can't find and load command '${commandName}'`);
@@ -1916,81 +1913,58 @@ class WebpackCLI {
     );
   }
 
-  async #loadCommandByName(commandName: string, allowToInstall = false) {
+  async #loadCommandByName(commandName: string): Promise<Command | undefined> {
     if (this.#isCommand(commandName, this.#commands.build)) {
-      await this.makeCommand(this.#commands.build);
+      return await this.makeCommand(this.#commands.build);
     } else if (this.#isCommand(commandName, this.#commands.serve)) {
-      await this.makeCommand(this.#commands.serve);
+      return await this.makeCommand(this.#commands.serve);
     } else if (this.#isCommand(commandName, this.#commands.watch)) {
-      await this.makeCommand(this.#commands.watch);
+      return await this.makeCommand(this.#commands.watch);
     } else if (this.#isCommand(commandName, this.#commands.help)) {
       // Stub for the `help` command
-      await this.makeCommand(this.#commands.help);
+      return await this.makeCommand(this.#commands.help);
     } else if (this.#isCommand(commandName, this.#commands.version)) {
-      await this.makeCommand(this.#commands.version);
+      return await this.makeCommand(this.#commands.version);
     } else if (this.#isCommand(commandName, this.#commands.info)) {
-      await this.makeCommand(this.#commands.info);
+      return await this.makeCommand(this.#commands.info);
     } else if (this.#isCommand(commandName, this.#commands.configtest)) {
-      await this.makeCommand(this.#commands.configtest);
-    } else {
-      const builtInExternalCommandInfo = Object.values(this.#commands)
-        .filter((item) => item.external)
-        .find(
-          (externalBuiltInCommandInfo) =>
-            externalBuiltInCommandInfo.rawName === commandName ||
-            (Array.isArray(externalBuiltInCommandInfo.alias)
-              ? externalBuiltInCommandInfo.alias.includes(commandName)
-              : externalBuiltInCommandInfo.alias === commandName),
-        );
-
-      let pkg: string;
-
-      if (builtInExternalCommandInfo && builtInExternalCommandInfo.pkg) {
-        ({ pkg } = builtInExternalCommandInfo);
-      } else {
-        pkg = commandName;
-      }
-
-      if (pkg !== "webpack-cli" && !(await this.isPackageInstalled(pkg))) {
-        if (!allowToInstall) {
-          return;
-        }
-
-        pkg = await this.installPackage(pkg, {
-          preMessage: () => {
-            this.logger.error(
-              `For using this command you need to install: '${this.colors.green(pkg)}' package.`,
-            );
-          },
-        });
-      }
-
-      type Instantiable<
-        InstanceType = unknown,
-        ConstructorParameters extends unknown[] = unknown[],
-      > = new (...args: ConstructorParameters) => InstanceType;
-
-      let LoadedCommand: Instantiable<() => void>;
+      return await this.makeCommand(this.#commands.configtest);
+    }
 
-      try {
-        LoadedCommand = (await import(pkg)).default;
-      } catch {
-        // Ignore, command is not installed
-        return;
-      }
+    const pkg: string = commandName;
 
-      let command;
+    type Instantiable<
+      InstanceType = unknown,
+      ConstructorParameters extends unknown[] = unknown[],
+    > = new (...args: ConstructorParameters) => InstanceType & { apply(cli: WebpackCLI): Command };
 
-      try {
-        command = new LoadedCommand();
+    let LoadedCommand: Instantiable<() => void>;
 
-        await command.apply(this);
-      } catch (error) {
+    try {
+      LoadedCommand = (await import(pkg)).default;
+    } catch (error) {
+      if ((error as NodeJS.ErrnoException).code !== "ERR_MODULE_NOT_FOUND") {
         this.logger.error(`Unable to load '${pkg}' command`);
         this.logger.error(error);
         process.exit(2);
       }
+
+      return;
+    }
+
+    let command;
+    let externalCommand: Command;
+
+    try {
+      command = new LoadedCommand();
+      externalCommand = await command.apply(this);
+    } catch (error) {
+      this.logger.error(`Unable to load '${pkg}' command`);
+      this.logger.error(error);
+      process.exit(2);
     }
+
+    return externalCommand;
   }
 
   async run(args: readonly string[], parseOptions: ParseOptions) {
@@ -2123,25 +2097,25 @@ class WebpackCLI {
         process.exit(0);
       }
 
-      let commandNameToRun = operand;
-      let commandOperands = operands.slice(1);
-
       let isKnownCommand = false;
 
       for (const command of Object.values(this.#commands)) {
         if (
-          command.rawName === commandNameToRun ||
+          command.rawName === operand ||
           (Array.isArray(command.alias)
-            ? command.alias.includes(commandNameToRun)
-            : command.alias === commandNameToRun)
+            ? command.alias.includes(operand)
+            : command.alias === operand)
         ) {
           isKnownCommand = true;
           break;
         }
       }
 
+      let command: Command | undefined;
+      let commandOperands = operands.slice(1);
+
       if (isKnownCommand) {
-        await this.#loadCommandByName(commandNameToRun, true);
+        command = await this.#loadCommandByName(operand);
       } else {
         let isEntrySyntax: boolean;
 
@@ -2153,33 +2127,39 @@ class WebpackCLI {
         }
 
         if (isEntrySyntax) {
-          commandNameToRun = defaultCommandNameToRun;
           commandOperands = operands;
 
-          await this.#loadCommandByName(commandNameToRun);
+          command = await this.#loadCommandByName(defaultCommandNameToRun);
         } else {
-          this.logger.error(`Unknown command or entry '${operand}'`);
+          // Try to load external command
+          try {
+            command = await this.#loadCommandByName(operand);
+          } catch {
+            // Nothing
+          }
 
-          const found = Object.values(this.#commands).find(
-            (commandOptions) => distance(operand, commandOptions.rawName) < 3,
-          );
+          if (!command) {
+            this.logger.error(`Unknown command or entry '${operand}'`);
 
-          if (found) {
-            this.logger.error(
-              `Did you mean '${found.rawName}' (alias '${Array.isArray(found.alias) ? found.alias.join(", ") : found.alias}')?`,
+            const found = Object.values(this.#commands).find(
+              (commandOptions) => distance(operand, commandOptions.rawName) < 3,
             );
-          }
 
-          this.logger.error("Run 'webpack --help' to see available commands and options");
-          process.exit(2);
+            if (found) {
+              this.logger.error(
+                `Did you mean '${found.rawName}' (alias '${Array.isArray(found.alias) ? found.alias.join(", ") : found.alias}')?`,
+              );
+            }
+
+            this.logger.error("Run 'webpack --help' to see available commands and options");
+            process.exit(2);
+          }
         }
       }
 
-      const command = this.#findCommandByName(commandNameToRun);
-
       if (!command) {
         throw new Error(
-          `Internal error: Registered command "${commandNameToRun}" is missing an action handler.`,
+          `Internal error: Registered command "${operand}" is missing an action handler.`,
         );
       }
 

test/external-command/external-command.test.js

@@ -0,0 +1,71 @@
+const { run } = require("../utils/test-utils");
+
+describe("external command", () => {
+  it("should work", async () => {
+    const { exitCode, stdout, stderr } = await run(__dirname, ["custom-command"], {
+      nodeOptions: ["--import=./register-loader.mjs"],
+    });
+
+    expect(exitCode).toBe(0);
+    expect(stderr).toBeFalsy();
+    expect(stdout).toContain("custom unknown");
+  });
+
+  it("should work with options", async () => {
+    const { exitCode, stdout, stderr } = await run(__dirname, ["custom-command", "--output=json"], {
+      nodeOptions: ["--import=./register-loader.mjs"],
+    });
+
+    expect(exitCode).toBe(0);
+    expect(stderr).toBeFalsy();
+    expect(stdout).toContain("custom json");
+  });
+
+  it("should work with help", async () => {
+    const { exitCode, stdout, stderr } = await run(__dirname, ["help", "custom-command"], {
+      nodeOptions: ["--import=./register-loader.mjs"],
+    });
+
+    expect(exitCode).toBe(0);
+    expect(stderr).toBeFalsy();
+    expect(stdout).toContain("Usage: webpack custom-command|cc [options]");
+    expect(stdout).toContain("-o, --output <value>  To get the output in a specified format");
+  });
+
+  it("should work with help for option", async () => {
+    const { exitCode, stdout, stderr } = await run(
+      __dirname,
+      ["help", "custom-command", "--output"],
+      {
+        nodeOptions: ["--import=./register-loader.mjs"],
+      },
+    );
+
+    expect(exitCode).toBe(0);
+    expect(stderr).toBeFalsy();
+    expect(stdout).toContain("Usage: webpack custom-command --output <value>");
+    expect(stdout).toContain("Description: To get the output in a specified format");
+  });
+
+  it("should handle errors in external commands", async () => {
+    const { exitCode, stdout, stderr } = await run(__dirname, ["errored-custom-command"], {
+      nodeOptions: ["--import=./register-loader.mjs"],
+    });
+
+    expect(exitCode).toBe(2);
+    expect(stderr).toContain("Unable to load 'errored-custom-command' command");
+    expect(stderr).toContain("Error: error in apply");
+    expect(stdout).toBeFalsy();
+  });
+
+  it("should handle errors in external commands when loading", async () => {
+    const { exitCode, stdout, stderr } = await run(__dirname, ["errored-loading-custom-command"], {
+      nodeOptions: ["--import=./register-loader.mjs"],
+    });
+
+    expect(exitCode).toBe(2);
+    expect(stderr).toContain("Unable to load 'errored-loading-custom-command' command");
+    expect(stderr).toContain("Error: error in loading");
+    expect(stdout).toBeFalsy();
+  });
+});

test/external-command/my-loader.mjs

@@ -0,0 +1,23 @@
+import { join } from "node:path";
+import { pathToFileURL } from "node:url";
+
+export async function resolve(specifier, context, nextResolve) {
+  try {
+    return await nextResolve(specifier, context);
+  } catch (err) {
+    if (err.code === "ERR_MODULE_NOT_FOUND" && !specifier.startsWith(".")) {
+      try {
+        const baseDir = pathToFileURL(join(process.cwd(), "node_modules/")).href;
+        const resolved = join(baseDir, specifier, "index.js");
+
+        return {
+          url: resolved,
+          shortCircuit: true,
+        };
+      } catch {
+        throw err;
+      }
+    }
+    throw err;
+  }
+}