CLI Scripts used by the WordPress team for sites and packages.

npm i @yardinternet/toolkit

Yard toolkit CLI scripts

Usage

    $ yard-toolkit [action] [filetype] [options] [file/dir/glob ...]

Actions
    format        Runs formatter for specified filetype
    lint          Runs linter for specified filetype
    watch         Runs Vite watcher
    build         Runs Vite build

Filetypes
    js            JavaScript files (*.js)
    blade         Laravel Blade files (*.blade.php)
    css           Cascading Style Sheet files (*.css)
    scss          SCSS files (custom mode only) (*.scss)

Options
    -m, --mode <brave|custom>
                 Glob settings for different types of projects
                 Defaults to 'brave'.
    --no-        Prefix to negate option
                 Example: --no-fix or --no-mode
    -f, --fix
                 Enables auto fix for linter action.
                 Defaults to 'true'.
    --help       Show CLI usage
    --version    Shows version

For default for brave sites:

yard-toolkit format js

For other sites or packages use custom mode:

yard-toolkit format js -m custom './packages/**/*.js'

For default for brave sites:

yard-toolkit lint js

If you don't want auto fix

yard-toolkit lint js --no-fix

For other sites or packages use custom mode:

yard-toolkit lint js './packages/**/*.js' -m custom --no-fix

Run Vite watcher for Brave themes:

yard-toolkit watch themes

Run Vite watcher for Brave blocks:

yard-toolkit watch blocks

Run Vite build for Brave themes:

yard-toolkit build themes

Run Vite build for Brave blocks:

yard-toolkit build blocks

{
 "scripts": {
  "watch": "npm run watch:themes & npm run watch:blocks",
  "watch:themes": "yard-toolkit watch themes",
  "watch:blocks": "yard-toolkit watch blocks",
  "build": "npm run build:themes && npm run build:blocks",
  "build:themes": "yard-toolkit build themes",
  "build:blocks": "yard-toolkit build blocks",
  "lint:css": "yard-toolkit lint css",
  "lint:js": "yard-toolkit lint js",
  "format:css": "yard-toolkit format css",
  "format:js": "yard-toolkit format js",
  "format:blade": "yard-toolkit format blade",
  "start": "npm run watch", // alias 
  "prod-all": "npm run build", // alias
  "yard-toolkit": "yard-toolkit" // needed for Captain Hook to work properly
 },
}

1. Create an JavaScript file in the actions dir. The name of the file must be the name of the action.

actions/format.js

2. Create an function export function with the name of your action inside the JS file. This function must have the parameters: options (object with set options), filetype (string containing filetype), userPath (file/dir/glob ... passed by user)

export const format = ( options, filetype, userPath ) => {
    
};

3. Add your action to the actions config file.

import { format } from '../actions/format.js';

export const actions = {
    format: {
        name: 'format',
        func: format,
    },
};

4. Add a discription of your action to the help.js file

// prettier-ignore
export const help = `
Usage

    $ yard-toolkit [action] [filetype] [options] [file/dir/glob ...]

Actions
    ${ actions.format.name }        Runs formatter for specified filetype

Go to the filetypes.js and add the filetype. Don't forget to also add it to the help.js file.

export const filetypes = {
 blade: {
        name: 'blade',
        extension: '.blade.php',
    },
};

Go to the modes.js and add the mode. Don't forget to also add it to the help.js file.

The filetype field must link to an name of an filetype in the filetypes.js config.

After you added a new mode add the mode to the choices list of the option called mode

import { filetypes } from './filetypes.js';

export const modes = {
 examplemode: {
  name: 'custom',
        paths: [
            {
                filetype: filetypes.js.name,
                path: [
                    './web/app/themes/**/resources/scripts/**/*.js',
                    './web/app/themes/**/resources/scripts/**/*.jsx',
                ], // filetype with multiple glob paths
            },
            {
                filetype: filetypes.blade.name,
                path: './web/app/themes/**/resources/views/**/*.blade.php',
            }
            // this mode does not have an path for css './web/app/themes/**/resources/styles/**/*.css'
     ],
 },
};

import { modes } from './modes.js';

export const options = {
    mode: {
        name: 'mode',
        type: 'string',
        shortFlag: 'm',
        choices: [ modes.brave.name, modes.examplemode.name],
        default: modes.brave.name,
    },
};

Go to the options.js and add the option. Don't forget to also add it to the help.js file.

export const options = {
    mode: {
        name: 'mode',
        type: 'string',
        shortFlag: 'm',
        choices: [ modes.brave.name, modes.custom.name ],
        default: modes.brave.name,
    },
    fix: {
        name: 'fix',
        type: 'boolean',
        shortFlag: 'f',
        default: true,
    },
};

The ./packages/toolkit package is the central place for developer tools (e.g. npm run format, npm run lint).

Because it consumes configs and utilities from other packages (like @yardinternet/prettier-config, @yardinternet/eslint-config, etc.), it must explicitly declare all their dependencies — including prettier, eslint, plugins, and any other tools they require.

This is a quirk of pnpm: unlike npm or yarn, pnpm uses strict, isolated node_modules and does not automatically hoist undeclared dependencies. Declaring them here ensures that all CLI commands work reliably, regardless of where they’re run.