SuperAPI AI Directory
Partner中文AI newsFavorites
Skillswot-ui-v2

wot-ui-v2

Frontend & websites

View repository

Updated 10-16 09:15

About this skill

Wot UI V2 Skill

This skill is used to make the Agent, when handling tasks related to wot-ui v2, prioritize the existing capabilities of the component library, comply with uni-app scenario constraints, and combine them with the wot CLI to query offline knowledge.

Applicable scenarios

  • The user asks about the basic usage, props, events, slots, or style variables of a certain wd-* component.
  • Need to generate or refactor uni-app + Vue 3 + TypeScript wot-ui page or component code.
  • Need to provide the correct approach in scenarios such as ConfigProvider, theme variables, dark mode, internationalization, feedback hooks, forms, etc.
  • Need to troubleshoot common Toast、Dialog、Popup、Tabs、Sliderand style override issues in the documentation.
  • When the user only mentions theme customization in a general way, but has not yet explicitly requested the structure of "single-file theme SCSS + App.vue only @use".

Recommended workflow

  1. First use this repository's CLI or MCP tool to look up component knowledge.
  2. Then decide the import path and integration method based on the project's actual installation method.
  3. Prioritize reusing existing wd-* components, hooks, theme variables, and composition patterns; do not degrade into stacking native tags.
  4. If the issue involves constraints or pitfalls, then consult Reference knowledge。
  5. If the user explicitly requests generating a src/themes/styles/{主题名}.scss single-file theme and moving the mounting logic into the theme file, prioritize switching to create-wot-ui-theme skill。

Query order

  1. wot list Find the component name.
  2. wot info <Component> Look at props, events, slots, CSS variables.
  3. wot demo <Component> Look at the demo name or specific demo code.
  4. wot doc <Component> Look at the complete markdown documentation.
  5. wot token <Component> Look at theme variables.

Working rules

  • By default, treat wot-ui as a uni-app + Vue 3 + TypeScript component library.
  • When writing pages, prioritize outputting script setup style.
  • Feedback capabilities such as useToast、useDialog、useNotify、useImagePreview、useVideoPreview; in addition to hook calls, they usually also require explicit declaration of the corresponding component instance in the page.
  • Documentation often contains @/uni_modules/wot-ui import paths; if the user's project uses npm installation, switch to @wot-ui/ui。
  • Theme customization should prioritize ConfigProvider and CSS variables; do not prioritize recommending deep overrides of internal class names.
  • When generating code, try to follow the naming and interaction patterns in the component library documentation, for example v-model:visible、before-confirm、confirm、change、custom-class、custom-style。

Reference materials