Vue Extractor

Converts Vue Single File Components (SFCs) into Design IR. Handles Vue 2/3 and Nuxt projects.

What This Extracts

Source Pattern	IR Output
`<template>` content	Node tree
`<div class="...">`	Frame node (`fr`) with mapped styles
`<button @click="...">`	Button node (`btn`)
`<input v-model="..." />`	Input node (`inp`)
`<img :src="..." />`	Image node (`img`)
`v-if="condition"`	Primary branch only
`v-for="item in items"`	One iteration
`<slot>`	Placeholder / content area
Vuetify `<v-btn>`, `<v-card>`	Mapped to IR types

Related skills