Vue Best Practices Workflow - **name_fr:** Workflow de bonnes pratiques Vue - **tl_en:** The Vue 3 workflow — Composition API + <script setup> + TypeScript, component architecture, must-read references - **tl_fr:** Le workflow Vue 3 — Composition API + <script setup> + TypeScript, architecture de composants, références obligatoires - **creator:** @vuejs-ai - **type:** Agent skill - **url:** https://github.com/vuejs-ai/skills - **cat:** Frontend - **kws:** vue, vue 3, composition api, typescript, script setup, components, volar, ssr, pinia, vite - **license:** MIT **Description EN:** Curated by Skill Harbor — an ordered workflow for Vue tasks: confirm the architecture first (Vue 3 + Composition API + `<script setup lang="ts">` as the standard, unless the project explicitly requires Options API or JSX), plan component boundaries with one-sentence responsibilities and explicit props/emits contracts, then apply the core foundations (one source of truth, props-down/events-up, small focused components, deliberate computed/watcher use) — with must-read core references on reactivity, SFCs, data flow and composables kept active through the whole task. By @vuejs-ai, listed here with credit to its creator; 39,898 installs make it one of the most-used skills in this catalog wave. Honest caveats: community-maintained by the vuejs-ai project, not the official Vue.js team — it still tracks the documented Vue 3 idioms; version 18.0.0 of the source. Skill Harbor never reviews the code, review it yourself before use. Discovered via skills.sh. **Description FR:** Sélectionné par Skill Harbor — un workflow ordonné pour les tâches Vue : confirmer d'abord l'architecture (Vue 3 + Composition API + `<script setup lang="ts">` comme standard, sauf si le projet exige explicitement Options API ou JSX), planifier les frontières de composants avec responsabilités en une phrase et contrats props/emits explicites, puis appliquer les fondations (source de vérité unique, props vers le bas/événements vers le haut, composants petits et ciblés, usage réfléchi des computed/watchers) — avec références centrales obligatoires sur la réactivité, les SFC, le flux de données et les composables, gardées actives tout au long de la tâche. Crédit : @vuejs-ai ; 39 898 installs en font l'un des skills les plus utilisés de cette vague du catalogue. Bémols honnêtes : maintenu par la communauté du projet vuejs-ai, pas par l'équipe officielle de Vue.js — il suit tout de même les idiomes documentés de Vue 3 ; version 18.0.0 de la source. Skill Harbor ne vérifie jamais le code, examinez-le vous-même avant usage. Découvert via skills.sh. **Install prompt EN:** ``` Prerequisites: a Vue project (Vue 3 recommended — the default workflow); none otherwise Install "Vue Best Practices Workflow" for me. Give my agent the ordered Vue 3 workflow — architecture confirmation, component-boundary planning, core foundations, must-read references on reactivity/SFC/data flow/composables Repository: https://github.com/vuejs-ai/skills/blob/main/skills/vue-best-practices/SKILL.md 1. Fetch the SKILL.md file for the vuejs-ai-skills-vue-best-practices skill from the repository into a temporary folder and summarize what it does in one or two sentences. 2. Safety check: review the SKILL.md for anything suspicious (unexpected network calls, shell commands, credential harvesting). This repo should contain zero secrets in code, credentials only via the secure vault, allowed hosts declared in the SKILL.md. Verify that holds here; STOP on any red flag and tell me. 3. Install it as a skill: copy SKILL.md into the agent's skills directory, in a folder named "vuejs-ai-skills-vue-best-practices". 4. Verify with no network calls: frontmatter valid, files in place. 5. Report what was installed, where, and what I still need to do myself (e.g. nothing — it is a pure workflow skill). GitHub is optional: if I have a GitHub account or the gh CLI, you may use it; otherwise public access is fine. Never require it unless it's in the prerequisites above. Rules: don't touch anything outside the temp folder and the install target. If anything looks off, stop and ask me. ``` **Install prompt FR:** ``` Prérequis : un projet Vue (Vue 3 recommandé — le workflow par défaut) ; rien d'autre Installe-moi « Workflow de bonnes pratiques Vue ». Donne à mon agent le workflow ordonné Vue 3 — confirmation d'architecture, planification des frontières de composants, fondations centrales, références obligatoires sur réactivité/SFC/flux de données/composables Dépôt : https://github.com/vuejs-ai/skills/blob/main/skills/vue-best-practices/SKILL.md 1. Récupère le fichier SKILL.md du skill vuejs-ai-skills-vue-best-practices depuis le dépôt dans un dossier temporaire et résume en une ou deux phrases ce qu'il fait. 2. Contrôle de sécurité : examine le SKILL.md pour tout contenu suspect (appels réseau inattendus, commandes shell, récolte d'identifiants). Ce dépôt ne doit contenir aucun secret dans le code ; les identifiants passent uniquement par le coffre sécurisé, les hôtes autorisés sont déclarés dans le SKILL.md. Vérifie que c'est bien le cas ; STOP sur le moindre signal d'alerte et préviens-moi. 3. Installe-le comme skill : copie SKILL.md dans le répertoire des skills de l'agent, dans un dossier nommé « vuejs-ai-skills-vue-best-practices ». 4. Vérifie sans aucun appel réseau : frontmatter valide, fichiers en place. 5. Indique ce qui a été installé, où, et ce qu'il me reste à faire moi-même (p. ex. rien — c'est un skill de workflow pur). GitHub est optionnel : si j'ai un compte GitHub ou la CLI gh, tu peux l'utiliser ; sinon l'accès public suffit. Ne jamais l'exiger sauf si c'est dans les prérequis ci-dessus. Règles : ne touche à rien en dehors du dossier temporaire et de la cible d'installation. Si quelque chose semble anormal, arrête-toi et demande-moi. ``` ---

Le workflow Vue 3 — Composition API + <script setup> + TypeScript, architecture de composants, références obligatoires - **creator:** @vuejs-ai - **type:** Agent skill - **url:** https://github.com/vuejs-ai/skills - **cat:** Frontend - **kws:** vue, vue 3, composition api, typescript, script setup, components, volar, ssr, pinia, vite - **license:** MIT **Description EN:** Curated by Skill Harbor — an ordered workflow for Vue tasks: confirm the architecture first (Vue 3 + Composition API + `<script setup lang="ts">` as the standard, unless the project explicitly requires Options API or JSX), plan component boundaries with one-sentence responsibilities and explicit props/emits contracts, then apply the core foundations (one source of truth, props-down/events-up, small focused components, deliberate computed/watcher use) — with must-read core references on reactivity, SFCs, data flow and composables kept active through the whole task. By @vuejs-ai, listed here with credit to its creator; 39,898 installs make it one of the most-used skills in this catalog wave. Honest caveats: community-maintained by the vuejs-ai project, not the official Vue.js team — it still tracks the documented Vue 3 idioms; version 18.0.0 of the source. Skill Harbor never reviews the code, review it yourself before use. Discovered via skills.sh. **Description FR:** Sélectionné par Skill Harbor — un workflow ordonné pour les tâches Vue : confirmer d'abord l'architecture (Vue 3 + Composition API + `<script setup lang="ts">` comme standard, sauf si le projet exige explicitement Options API ou JSX), planifier les frontières de composants avec responsabilités en une phrase et contrats props/emits explicites, puis appliquer les fondations (source de vérité unique, props vers le bas/événements vers le haut, composants petits et ciblés, usage réfléchi des computed/watchers) — avec références centrales obligatoires sur la réactivité, les SFC, le flux de données et les composables, gardées actives tout au long de la tâche. Crédit : @vuejs-ai ; 39 898 installs en font l'un des skills les plus utilisés de cette vague du catalogue. Bémols honnêtes : maintenu par la communauté du projet vuejs-ai, pas par l'équipe officielle de Vue.js — il suit tout de même les idiomes documentés de Vue 3 ; version 18.0.0 de la source. Skill Harbor ne vérifie jamais le code, examinez-le vous-même avant usage. Découvert via skills.sh. **Install prompt EN:** ``` Prerequisites: a Vue project (Vue 3 recommended — the default workflow); none otherwise Install "Vue Best Practices Workflow" for me. Give my agent the ordered Vue 3 workflow — architecture confirmation, component-boundary planning, core foundations, must-read references on reactivity/SFC/data flow/composables Repository: https://github.com/vuejs-ai/skills/blob/main/skills/vue-best-practices/SKILL.md 1. Fetch the SKILL.md file for the vuejs-ai-skills-vue-best-practices skill from the repository into a temporary folder and summarize what it does in one or two sentences. 2. Safety check: review the SKILL.md for anything suspicious (unexpected network calls, shell commands, credential harvesting). This repo should contain zero secrets in code, credentials only via the secure vault, allowed hosts declared in the SKILL.md. Verify that holds here; STOP on any red flag and tell me. 3. Install it as a skill: copy SKILL.md into the agent's skills directory, in a folder named "vuejs-ai-skills-vue-best-practices". 4. Verify with no network calls: frontmatter valid, files in place. 5. Report what was installed, where, and what I still need to do myself (e.g. nothing — it is a pure workflow skill). GitHub is optional: if I have a GitHub account or the gh CLI, you may use it; otherwise public access is fine. Never require it unless it's in the prerequisites above. Rules: don't touch anything outside the temp folder and the install target. If anything looks off, stop and ask me. ``` **Install prompt FR:** ``` Prérequis : un projet Vue (Vue 3 recommandé — le workflow par défaut) ; rien d'autre Installe-moi « Workflow de bonnes pratiques Vue ». Donne à mon agent le workflow ordonné Vue 3 — confirmation d'architecture, planification des frontières de composants, fondations centrales, références obligatoires sur réactivité/SFC/flux de données/composables Dépôt : https://github.com/vuejs-ai/skills/blob/main/skills/vue-best-practices/SKILL.md 1. Récupère le fichier SKILL.md du skill vuejs-ai-skills-vue-best-practices depuis le dépôt dans un dossier temporaire et résume en une ou deux phrases ce qu'il fait. 2. Contrôle de sécurité : examine le SKILL.md pour tout contenu suspect (appels réseau inattendus, commandes shell, récolte d'identifiants). Ce dépôt ne doit contenir aucun secret dans le code ; les identifiants passent uniquement par le coffre sécurisé, les hôtes autorisés sont déclarés dans le SKILL.md. Vérifie que c'est bien le cas ; STOP sur le moindre signal d'alerte et préviens-moi. 3. Installe-le comme skill : copie SKILL.md dans le répertoire des skills de l'agent, dans un dossier nommé « vuejs-ai-skills-vue-best-practices ». 4. Vérifie sans aucun appel réseau : frontmatter valide, fichiers en place. 5. Indique ce qui a été installé, où, et ce qu'il me reste à faire moi-même (p. ex. rien — c'est un skill de workflow pur). GitHub est optionnel : si j'ai un compte GitHub ou la CLI gh, tu peux l'utiliser ; sinon l'accès public suffit. Ne jamais l'exiger sauf si c'est dans les prérequis ci-dessus. Règles : ne touche à rien en dehors du dossier temporaire et de la cible d'installation. Si quelque chose semble anormal, arrête-toi et demande-moi. ``` ---

Version :