SuperAPI AI Directory
Partner中文AI newsFavorites
Skillswxa-create-mp-skill

wxa-create-mp-skill

Coding & development

View repository

Updated 10-16 01:34

About this skill

wxa-create-mp-skill

Create a new AI Skill in an existing mini program project.

Scope of responsibility

  • ✅ Understand user requirements and design atomic interfaces
  • ✅ Produce SKILL.md + mcp.json design documents
  • ✅ Call wxa-skills-generate to generate complete code
  • ✅ Call wxa-skills-validate to validate, execute, and render
  • ✅ Fix validation issues until all pass
  • ❌ Create a new mini program project (handled by wxa-create-ai-miniprogram）
  • ❌ Search for and install community Skills (handled by wxa-find-skills）
  • ❌ Modify the mini program main package code (e.g., app.js, page files)
  • ❌ Publish the Skill to the app marketplace
  • 📦 Deliverables:skills/{skill-name}/ complete subpackage + app.json registration

Terminology conventions

  • Atomic interface: A callable API exposed to the mini program AI, with the agreed path skills/{skill}/apis/{name}.js
  • Atomic component: A UI card that renders data returned by atomic interfaces, with the agreed path skills/{skill}/components/{name}/
  • SKILL.md: AI routing metadata that describes the business's trigger scenarios and usage order, ≤ 16KB
  • mcp.json: A model-callable capability declaration, ≤ 24000 characters after removing outputSchema
  • Wecard Design Specification: The visual baseline standard for atomic components. See Appendix A of the project SKILL-DEV-GUIDE.md for details

Reference index

Source Purpose Loading timing
npx mp-skills --help Obtain the <generate-dir> and <validate-dir> paths Before Step 3
<generate-dir>/SKILL.md The complete phased workflow of wxa-skills-generate Step 3 code generation
<generate-dir>/references/CODE_TEMPLATES.md mcp.json / index.js / interface implementation code templates When writing Step 2/3
<generate-dir>/references/ATOMIC_COMPONENT_DESIGN.md Atomic component design specification Step 3 component generation
<generate-dir>/references/JSAPI_WHITELIST.md Complete list of wx API allowlist During Step 3 code generation
<validate-dir>/SKILL.md Detailed validation rules and repair workflow Step 4 validation + Step 5 repair
<validate-dir>/references/VALIDATE_RULES.md V001~V016 rule details When a validation error requires locating an id
<validate-dir>/references/CLI_AGENT_REFERENCE.md Usage of execute/render scripts Step 4 execution
<project>/SKILL-DEV-GUIDE.md Project development standards and the WeCard visual baseline During Step 2 design
<mode-dev-dir>/SKILL.md AI development mode development standards (content writing style, description templates, prohibition set) During Step 2 design
<mode-dev-dir>/references/BEST_PRACTICES.md content text writing style, three-part description template, common prohibitions When writing content/description in Step 2/3

<generate-dir>、<validate-dir> and <mode-dev-dir> are obtained in Step 3 via npx mp-skills --help .

Hard constraints

A. Project prerequisites

Condition Description
Must be an existing mp-skills project (with a skills/ directory) Otherwise an independent subpackage cannot be created
The project has already executed npx mp-skills setup Ensure the cloud development environment is ready
Do not overwrite an existing Skill directory If a directory with the same name already exists, prompt the user to choose a different name

B. Interface Design Specifications

Rule Description
Interface naming camelCase searchItems、placeOrder, do not use search_items
Moderate interface granularity Each interface has a single responsibility; one skill is recommended to have 3-6 interfaces
description includes preconditions "Calling precondition: the user has already entered the order page"
description includes strictly prohibited scenarios "[Strictly Prohibited Scenarios] Do not use to modify paid orders"
mcp.json ≤ 24000 characters Size limit after removing outputSchema

C. Component Specifications

  • Comply with the WeCard design specifications (see Appendix A of SKILL-DEV-GUIDE.md for details)
  • Component path format:components/{name}/index(relative path, without subpackage prefix)
  • Every interface with UI must be associated with _meta.ui.componentPath

D. Blocking Rules (Stop Immediately)

Blocking Situation Handling Method
The functionality described by the user already exists in an existing community Skill Recommend searching and installing first; do not create duplicates
The requirement is too broad (more than 6 interfaces) Split into multiple independent Skills
wxa-skills-generate cannot handle it Inform the user of the capability limitation and provide alternatives
3 consecutive rounds of validation still fail Mark as a difficult issue and request user confirmation before continuing

Workflow

Step 1 — Requirement Understanding and Interface Design

Clarify functional requirements through dialogue with the user. Interface division follows these principles:

  • Each interface has a single responsibility:searchItems、getDetail、placeOrder each handles its own part
  • Do not make one interface do too many things (avoid AI selection difficulty)
  • Do not split too finely (avoid multiple API calls)
  • Recommend 3-6 atomic interfaces

Output the interface list, and proceed to the next step only after user confirmation.

Step 2 — Produce Design Documents

Under skills/<skill-name>/ create:

SKILL.md(business routing description, ≤ 16KB):

  • Capability domain positioning
  • Trigger scenarios (few-shot user original words)
  • Out-of-scope
  • Usage order

mcp.json(model-callable capability declaration, after removing outputSchema ≤ 24000 characters):

{
  "apis": [
    {
      "name": "searchItems",
      "description": "搜索商品列表。\n调用前置条件：...\n【严禁场景】...",
      "inputSchema": { "type": "object", "properties": {...}, "required": [...] },
      "_meta": { "ui": { "componentPath": "components/item-list-card/index" } }
    }
  ],
  "components": [
    { "path": "components/item-list-card/index", "relatedPage": "/pages/index/index" }
  ]
}

After producing it, have the user confirm the design. Do not proceed to the next step before confirmation.

Step 3 — Code Generation

First obtain the official skill path and record it to a variable:

npx mp-skills --help

The bottom of the output will show:

工具型 Skill 路径（供 AI 模型引用）:
  wxa-skills-generate: /Users/xxx/.mp-skills/skills/wxa-skills-generate/SKILL.md
  wxa-skills-validate: /Users/xxx/.mp-skills/skills/wxa-skills-validate/SKILL.md

Record the two paths (remove the trailing /SKILL.md）：

  • <generate-dir> = the directory where wxa-skills-generate is located
  • <validate-dir> = the directory where wxa-skills-validate is located

Then read <generate-dir>/SKILL.md, and execute code generation according to its staged workflow. Just follow its guidance; there is no need to repeat every step here.

Note: wxa-skills-generate will automatically handle wx API whitelist checks, atomic component constraints, and subpackage configuration. Do not bypass these constraints.

Step 4 — Validation

Use the <validate-dir> path recorded in Step 3.

4.1 Static Validation

node <validate-dir>/scripts/validate.mjs <project-path>

Pass conditions:summary.errors === 0 and summary.buildStatus === "pass"。

4.2 API execution + component rendering

After static validation passes, for each API with _meta.ui.componentPath :

# 执行原子接口
node <validate-dir>/scripts/execute.mjs \
  --project <project-path> --name <api-name> --args '{}' \
  --output ./cli-agent-run/execute-result.<name>.json

# 渲染组件
node <validate-dir>/scripts/render.mjs \
  --project <project-path> \
  --from-execute ./cli-agent-run/execute-result.<name>.json \
  --output ./cli-agent-run/render-result.<name>.json

Step 5 — Fix issues

If any validation fails, handle it according to the repair process in wxa-skills-validate/SKILL.md:

Type Feature Fix scope
T1 Naming/spelling Field case/spelling error Direct change in a single line of a single file
T2 Schema inconsistency structuredContent does not match outputSchema Align apis + mcp.json
T3 Component binding inconsistency WXML and setData fields do not match Align components JS/WXML
T4 Incorrect component value path Incorrect result.structuredContent.xxx path Fix component JS
T5 Compliance violation Non-whitelisted tags/CSS Replace with whitelisted ones
T6 Missing registration The name declared in mcp.json is not registerAPI Add registration in index.js
T7/T8 Link/granularity storage key or API division issue Cross-file adjustment
T9 Capability cannot be implemented All candidates violate hard constraints ⛔ Terminate, inform the user
T-build compilation failure stage=compile + FAIL Check the integration configuration first, then modify the source code

After fixing, rerun validation until all pass.

Step 6 — Wrap up

Confirm that app.json 's agent.skills[] already includes the new Skill. Prompt the user to run npx mp-skills setup to complete environment configuration.

ClawHub

https://clawhub.ai/binggg/wxa-create-mp-skill

Install:npx skills add TencentCloudBase/mp-skills -s wxa-create-mp-skill