This is a VSCode extension for my TVA workflow (Tailwind - Vue - Atomic Design).
It extracts a selected block of code into a Vue component and places it under the appropriate folder (atoms, molecules, or organisms) following your project structure.
How to use
Select the block of code you want to extract.
Press Ctrl + Shift + P (Windows/Linux) or Cmd + Shift + P (Mac) to open the command palette.
Run the extraction command and answer the prompts.
Limitations
This extension is custom-built for my workflow.
Feel free to contact me if you want edits or access to the source code.
Limitations
To ensure the extension works correctly :
Use VueJS (Composition API) or React.
Use alias imports that start with /app.
If you are not using Atomic Design, make sure to toggle the relevant option in the extension settings.
Notes
Extracted components follow the Atomic Design methodology by default.
Make sure your workspace has write permissions for the target folders.