SuperAPI AI Directory

orderly-plugin-create

Coding & development

View repository

Updated 10-16 03:12

About this skill

Orderly plugin — create (CLI)

Scaffold a new plugin package using @orderly.network/devkit (the official template).

When to use

  • User wants to generate a new plugin project from the CLI template.
  • After scaffolding, use orderly-plugin-write to develop plugin code.

Prerequisites

  • Node.js >= 20.19.0
  • CLI: npx orderly-devkit (preferred if repo depends on the devkit) or npx @orderly.network/devkit

Inputs to collect

Ask for these if missing. For naming validation rules, see reference.md § Naming conventions:

Input Flag Description
Plugin name --name / -n PascalCase, e.g. BuySellButtons
Plugin ID --id / -i Optional. Default: kebab-case of name, e.g. buy-sell-buttons
Interceptor target --interceptor Where the plugin UI appears (see table below)
Target directory --target / -t Where to create plugin folder. Default: ./<PluginName>

Supported --interceptor targets

For SDK runtime targets, see:

The installed devkit's --interceptor choices are only scaffold defaults and may include legacy paths or omit newer SDK paths. If the desired target is missing, scaffold with any target and edit the generated interceptors[].target string manually; always verify the final path with the SDK Inspector.

Tip: Use the Inspector tool in your development environment to discover all available interceptor target paths.

Step 1 — Check CLI options

npx orderly-devkit create plugin --help

Or:

npx @orderly.network/devkit create plugin --help

Show the output to see available flags and current defaults.

Step 2 — Confirm and run

After collecting inputs, summarize before running:

Plugin: <Name>
ID: <plugin-id>
Target: <path>
Interceptor: <interceptor-target>

Run from the parent directory (where the plugin folder should be created):

npx orderly-devkit create plugin \
  --name "<PluginName>" \
  --id "<plugin-id>" \
  --interceptor "<InterceptorTarget>" \
  --target "<path>"

Or with pnpm:

pnpm orderly-devkit create plugin \
  --name "<PluginName>" \
  --id "<plugin-id>" \
  --interceptor "<InterceptorTarget>" \
  --target "<path>"

After creation

Plugin generated at: <target-directory>

Generated structure

<target-directory>/
├── src/
│   ├── index.tsx      # Entry point, exports registerOrderlyPlugin()
│   ├── plugin.tsx     # Registration function with createInterceptor() and setup
│   ├── components/    # Widget / business-logic / UI layers
│   ├── types/         # TypeScript definitions
│   ├── i18n/           # LocaleProvider and locale messages
│   └── tailwind.css
├── package.json
├── tsconfig.json
├── tsup.config.ts
├── tailwind.config.cjs
├── README.md
├── .orderly-manifest.json  # Generated by the CLI after template download
└── pnpm-lock.yaml

Next steps

  1. Review manifest: Open .orderly-manifest.json to verify metadata.
  2. Verify generated metadata: Open src/plugin.tsx and make sure id, name, version, and orderlyVersion are real values rather than unresolved or empty template placeholders.
  3. Develop plugin: See orderly-plugin-write for:
    • Architecture patterns (Widget, Page, Layout)
    • Interceptor strategies (Enhance, Wrap, Replace)
    • Hooks usage and props typing
    • Setup, error hooks, and best practices
  4. Wire into app: See orderly-plugin-add to add to OrderlyAppProvider.
  5. Publish: See orderly-plugin-submit for Marketplace submission.

Reference

  • reference.md — create-command specific details (template variables, generated structure)
  • shared reference — naming rules, interceptor targets, and manifest constraints