Skills

Webiny CLI Extensions

Adding custom commands to the Webiny CLI using CliCommandFactory.

Install

npx skills add webiny/webiny-js --skill webiny-cli-extensions -g -a claude-code -y
Repository
webiny/webiny-js8.1k
Category
Design
Updated
5d ago
License
See repository
Context cost
Lightabout 1,233 tokens
Runs scripts
No, instructions only

What it does

Adding custom commands to the Webiny CLI using CliCommandFactory. Use this skill when the developer wants to create a custom CLI command, add a data migration script, build a code generator, create deployment scripts, export CMS content, or add health check commands. Covers CliCommandFactory.Interface, command definition, typed parameters, the Ui service for terminal output, and registration via <Cli.Command>.

CLI Extensions

TL;DR

Add custom commands to the Webiny CLI using the CliCommandFactory pattern. Define a class implementing CliCommandFactory.Interface<TParams>, specify command name, description, params, and handler, then export with CliCommandFactory.createImplementation(). Register in webiny.config.tsx via <Cli.Command>.

The CliCommandFactory Pattern

// extensions/MyCustomCommand.ts
import { Ui } from "webiny/cli";
import { CliCommandFactory } from "webiny/cli/command";

export interface IMyCustomCommandParams {
  name: string;
}

class MyCustomCommandImpl implements CliCommandFactory.Interface<IMyCustomCommandParams> {
  constructor(private ui: Ui.Interface) {}

  execute(): CliCommandFactory.CommandDefinition<IMyCustomCommandParams> {
    return {
      name: "my-custom-command",
      description: "This is my custom command",
      examples: ["$0 my-custom-command test1", "$0 my-custom-command test2"],
      params: [
        {
          name: "name",
          description: "Your name",
          type: "string"
        }
      ],
      handler: async params => {
        this.ui.info("Starting my custom command...");
        this.ui.emptyLine();
        this.ui.success(`Hello, ${params.name}! This is my custom command.`);
      }
    };
  }
}

export default CliCommandFactory.createImplementation({
  implementation: MyCustomCommandImpl,
  dependencies: [Ui]
});

Register in webiny.config.tsx (YOU MUST include the .ts file extension in the src prop, omitting it will cause a build failure):

<Cli.Command src={"/extensions/MyCustomCommand.ts"} />

Run it:

yarn webiny my-custom-command "World"

Command Definition Properties

Read the whole SKILL.md on GitHub

More in Design