new-feature

Automate creation of Vue/Quasar feature slices with FSD structure.

Updated Dec 22, 2025

Search Tags:#architecture #code generation #vue #quasar #feature sliced design

Ready to run

npx skills add https://github.com/SandroBeatz/layrix --skill new-feature-sandrobeatz

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: new-feature
Source: https://github.com/SandroBeatz/layrix/tree/main/.claude/skills/new-feature
Command: npx skills add https://github.com/SandroBeatz/layrix --skill new-feature-sandrobeatz

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve?

Overcomes the challenge of disorganized Vue/Quasar project architecture by streamlining the creation of feature slices with a standardized, Feature-Sliced Design (FSD) structure.

Core Features & Use Cases

Structured Scaffold: Automates the generation of a comprehensive directory structure for new features, including domain, action, UI, and model components.
Code Organization: Improves code maintainability and scalability by following an established folder and file naming convention.
User Actions: Enables users to add new actions quickly and efficiently by following simple guidelines and naming conventions.

Quick Start

Create a new feature slice named 'user/profile' using the new-feature skill.

Frequently Asked Questions about new-feature

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I automate Feature-Sliced Design structure creation for Vue and Quasar projects?▼

Automating Feature-Sliced Design structure creation for Vue and Quasar projects involves generating a standardized directory scaffold with UI components, model composables, types, and barrel exports. This approach overcomes disorganized architecture by enforcing strict folder and file naming conventions for new feature slices.

What is the best way to scaffold a new feature slice with domain and action naming?▼

The best way to scaffold a new feature slice using domain and action naming is to use an automated generator that creates the comprehensive FSD directory structure. This process quickly produces all necessary UI and model files, ensuring code organization and scalability for rapid prototyping.

Does Feature-Sliced Design work with Vue composables and Quasar components?▼

Feature-Sliced Design works effectively with Vue composables and Quasar components by structuring them into dedicated model and UI directories. This integration allows developers to add new actions efficiently while maintaining a clear separation of concerns across the application architecture.

How do I generate barrel exports and types for a Vue feature slice?▼

Generating barrel exports and types for a Vue feature slice is handled automatically during the FSD scaffold creation process. The automation builds these files alongside the UI components and model composables to establish a maintainable and scalable export structure for the new feature.

When do I need to use Feature-Sliced Design in my Vue application?▼

You need to use Feature-Sliced Design in your Vue application when facing challenges with disorganized project architecture and requiring rapid scalability. Implementing this standardized structure improves code maintainability by establishing a clear folder and file naming convention for generating new features.

Can I use this FSD scaffolding approach for rapid prototyping in Quasar?▼

You can use this FSD scaffolding approach for rapid prototyping in Quasar to quickly generate comprehensive directory structures. It automates the creation of domain, action, UI, and model components, allowing you to add new actions efficiently while maintaining established architectural conventions.