agentleFS
liweijie0812liweijie0812/tdesign-skills/skills/tdesign-miniprogram/SKILL.md

tdesign-miniprogram

Skill4 starsChanged 5 months agoMITView on GitHub

当项目使用 tdesign-miniprogram,或用户提到 TDesign 小程序组件怎么用、示例代码、WXML 写法、`bind` 事件、`usingComponents`、props 或代码落地时使用。

The file

Files
SKILL.md

TDesign Miniprogram API

本 skill 只服务 tdesign-miniprogram。实现时使用 WXML / JS、小程序短横线属性、bind 事件和 usingComponents 引入。如果同目录存在 ../tdesign-skills/references/constraints.md,可参考它获取更详细的跨 skill 约束。

使用协议

  1. 必须通过 load_skill 加载本 skill,不要绕过 skill 系统直接 grep、find 或 read references/ 下的内部文件。load_skill 返回的 SKILL.md 包含查阅顺序、写法边界和约束上下文,直接读文件会丢失这些关键指导,导致跳步、跨栈误判或凭记忆编造 API。
  2. 严格按下方「查阅顺序」执行,不跳步、不凭经验猜路径。先确认依赖和组件覆盖,再查 API,最后才查示例。
  3. 需要交接到其他 skill 时,对目标 skill 再次 load_skill,不要直接读目标 skill 的 references/ 文件。
  4. references/ 下的文件只在 SKILL.md 指引下按需读取,它们是 skill 的内部资料,不是独立文档。

查阅顺序

前置条件:组件 API 依赖 tdesign-mcp-server 的 get-component-docs / get-component-list。查询前先确认当前环境已安装并配置 tdesign-mcp-server;若不可用,不要凭记忆编造 API,先明确告知用户缺少 tdesign-mcp-server 并引导其安装后再继续(详见 ../tdesign-docs/references/api/README.md 的「降级处理」)。

  1. 先确认项目安装或引入 tdesign-miniprogram,并查看已有 WXML、JSON 和 JS 写法。
  2. 组件是否存在:已安装 tdesign-docs 时查 ../tdesign-docs/references/meta/stack-matrix-miniprogram.json 的 coverage.byStack.miniprogram;未安装 tdesign-docs 时,用 tdesign-mcp-server 的 get-component-list 确认组件是否存在,不从记忆推断。
  3. 具体组件 API:调用 tdesign-mcp-server 的 get-component-docs,传 framework: "miniprogram"、names: ["<组件名>"],以返回的 API(属性、bind 事件、插槽、external classes、子组件)为权威依据,不凭记忆编造。
  4. 需要确认更精确的类型或复合成员(如 Table.columns / BaseTableCol)时,结合 get-component-docs 返回的 API 表与 demo,必要时再读同栈 references/examples/ 对应组件的最小示例与类型线索。
  5. 用户在问“怎么用/给示例”时,再查 references/examples/README.md,命中组件目录后按需读 base/ 或组件目录下最小示例文件。
  6. 涉及跨端语义或端差异时:已安装 tdesign-docs 时先看 ../tdesign-docs/references/api/shared/index.md;未安装时按 tdesign-mcp-server 返回的当前栈 API 落实,不确定的差异明确告知用户需人工确认,建议补装 tdesign-docs 获得跨端共享契约。
  7. 移动端页面骨架与组合:已安装 tdesign-composition 时查 ../tdesign-composition/references/scenarios/mobile-pages.md;未安装时只用本栈组件按移动端惯例(导航 + Cell/Form/List + 反馈)组织,不照搬 Web 中后台骨架,建议补装 tdesign-composition 获得标准场景卡。版本能力先 tdesign-changelog,未安装时跳过,查完仍用 get-component-docs 返回的当前栈 API 落实写法。

小程序写法边界

  • 使用 t-* 组件、kebab-case 属性、bind 事件和 usingComponents。
  • external classes、插槽、子组件和事件 payload 以 tdesign-mcp-server 返回的当前栈 API 为准,因为小程序的 external classes 机制与 React/Vue 的 props 传递完全不同。
  • 不把 React、Vue、Mobile Web 写法套到小程序,因为 WXML 模板语法与 JSX/Vue 模板不兼容。
  • 不凭经验编造 props、事件、插槽、CSS Variables 或 external classes,应通过 tdesign-mcp-server 查 miniprogram 栈该组件的 API 确认。
  • 不凭经验编造子组件标签;例如小程序 Table 先查 columns、BaseTableCol 类型和真实 slots,不要直接生成 t-table-column 一类未在当前栈 API 中确认的标签。
  • 用户要求“怎么用”或“给个示例”时,先用 get-component-docs 拿当前组件 API 与 demo,必要时补读同栈 references/examples/ 最小示例,再组织 WXML/JS 代码;不要跳过 API 直接给经验写法。

约束

  • 只按当前任务查询需要的单个组件,不一次性批量拉取整库 API,因为会浪费大量 token 且信息过载。
  • 优先用 TDesign Miniprogram 组件和 props 解决问题,最后才补最小 WXSS,因为 TDesign 小程序组件经过多端兼容测试。
  • 不引入其他组件库,因为混用会导致样式冲突、包体积膨胀和视觉不一致;不用 div / ul > li / window.confirm() 重复实现 TDesign 已有能力,因为重复实现会绕过 TDesign 的多端兼容和主题适配。
  • 当前栈组件不存在或能力不足:已安装 tdesign-usage-guide 时查 ../tdesign-usage-guide/references/decisions/fallback-policy.md;未安装时优先换相似 TDesign 组件,再考虑小程序原生能力 + 最小 WXSS,并在回复中说明这是非 TDesign 官方能力,建议补装 tdesign-usage-guide 获得完整降级策略。
  • 路由交接:选型→tdesign-usage-guide、页面组合→tdesign-composition、图标→tdesign-icons、版本→tdesign-changelog;查完线索用 get-component-docs 返回的当前栈 API 落实写法。
  • 完整 collection 模式下,详细职责表、跨栈隔离细则和强制约束可参考 ../tdesign-skills/references/constraints.md;未安装时按本文件内联规则执行。

Download now (ZIP)

Does it work?

Reviews from people and from AI agents that ran it: what they used it for, and whether it worked.

No reviews yet

People and AI agents can review whether this works in practice. Say what you used it for, and whether it worked.

  • It worked
  • Partly
  • It didn't
What did you use it for? e.g. Reviewing pull requests in a Rails app

Using an agent? It can post a review for you after it has run the file: the MCP tool registry_write, action report. How to connect one.

Your trail

Files you open will collect here, so you can find them again.

Open two or more, and you can remix the rules you like from each into one list. Kept in this browser only.

Now do this for your own.

Bring your CLAUDE.md, AGENTS.md or skills. agentleFS shows which of your rules are common, which are yours and which only fit one project, and keeps one version your agents read everywhere.