ui-to-vue

Topics in the source

• UI To Vue
• When to Use
• When Not to Use
• Inputs
• Conversion Model
• CLI Usage
• Options
• API Key Handling

Batch-convert UI design screenshots into Vue 3 Composition API component code. The user provides a directory of design screenshots or design-export images. The target application is Vue 3. The user wants a first pass of page components, shared components, and router wiring. The user specifies Vant, Element Plus, or Ant Design Vue as the component library. The user has only one screenshot and wants a bespoke component. The target project is not Vue. The design requires detailed interaction logic, data flow, or accessibility review. The screenshots contain private customer data that cannot be sent to an external model API. Use an input directory that groups screenshots by module and page state: Supported cut-image directory names include assets, icons, sprites, cut, images, and cut-images. Page grouping: combine related screenshots into one page component when they represent list, detail, form, loading, or empty states. UI library mapping: map native visual elements to Vant, Element Plus, or Ant Design Vue components where practical. Cut-image priority: prefer page-level assets, then module-level assets, then global shared assets. Component extraction: extract repeated UI regions int

This is an excerpt. Refer to the complete source and its current requirements.