sdd-vue

Plugin sdd-vue from marketplace eli-marketplace in bingeli1379/eli-marketplace. Commands read from the repo's manifest — 6 days ago.

Skills (26)

• accessibility

  Use when auditing web accessibility, checking WCAG 2.1 AA compliance, or reviewing UI for screen reader and keyboard navigation issues.

• antfu

  Anthony Fu's opinionated tooling and conventions for JavaScript/TypeScript projects. Use when setting up new projects, configuring ESLint/Prettier alternatives, monorepos, library publishing, or when the user mentions Anthony Fu's preferences.

• core-web-vitals

  Optimize Core Web Vitals (LCP, INP, CLS) for better page experience and search ranking. Use when asked to "improve Core Web Vitals", "fix LCP", "reduce CLS", "optimize INP", "page experience optimization", or "fix layout shifts".

• create-adaptable-composable

  Use when creating reusable Vue composables that need to accept both plain values and reactive inputs (MaybeRef / MaybeRefOrGetter).

• frontend-testing-best-practices

  Testing best practices for the frontend. Emphasizes E2E tests over unit tests, minimal mocking, and testing behavior over implementation details. Use when writing tests or reviewing test code.

• nuxt

  Nuxt full-stack Vue framework with SSR, auto-imports, and file-based routing. Use when working with Nuxt apps, server routes, useFetch, middleware, or hybrid rendering.

• pinia

  Use when working with the Pinia API — defining stores, state/getters/actions, plugins, and store-usage syntax in Vue apps. For store design patterns, anti-patterns, and when-to-split decisions use vue-pinia-best-practices.

• pnpm

  Node.js package manager with strict dependency resolution. Use when running pnpm specific commands, configuring workspaces, or managing dependencies with catalogs, patches, or overrides.

• tailwind-best-practices

  Use when reviewing or refactoring existing Tailwind CSS — design-token consistency, repeated utility clusters that should be a component, arbitrary values that bypass the scale, and v3-era classes left in a v4 codebase. For writing new Tailwind (utilities, config, dark mode, responsive) use the tail

• tailwindcss

  Tailwind CSS v4 utility-first styling patterns including responsive design, dark mode, and custom configuration. Use when styling with Tailwind, adding utility classes, configuring Tailwind, setting up dark mode, or customizing the theme.

• turborepo

  Use when working with Turborepo — turbo.json, task pipelines, dependsOn, local and remote caching, --filter / --affected runs, boundaries, or monorepo package structure. For the package manager and workspace catalogs use pnpm.

• typescript-advanced-types

  Master TypeScript's advanced type system including generics, conditional types, mapped types, template literals, and utility types for building type-safe applications. Use when implementing complex type logic, creating reusable type utilities, or ensuring compile-time type safety in TypeScript proje

• unocss

  UnoCSS instant atomic CSS engine, superset of Tailwind CSS. Use when configuring UnoCSS, writing utility rules, shortcuts, or working with presets like Wind, Icons, Attributify.

• vite

  Vite build tool configuration, plugin API, SSR, and Vite 8 Rolldown migration. Use when working with Vite projects, vite.config.ts, Vite plugins, or building libraries/SSR apps with Vite.

• vitepress

  Use when working on a VitePress docs site — its config, theme and layout, Markdown extensions, i18n, SSR, or build. For plain Vite app and build config use vite; for the Vue components rendered inside the site use vue.

• vitest

  Vitest fast unit testing framework powered by Vite with Jest-compatible API. Use when writing tests, mocking, configuring coverage, or working with test filtering and fixtures.

• vue-best-practices

  Use when establishing or reviewing Vue idioms and standards — Composition-API-first with `<script setup>` + TypeScript, SSR / Volar / vue-tsc conventions, or deciding the idiomatic approach for new Vue code. For API syntax and how-to use the vue skill; for store / router / build specifics use pinia,

• vue-debug-guides

  Vue 3 debugging and error handling for runtime errors, warnings, async failures, and SSR/hydration issues. Use when diagnosing or fixing Vue issues.

• vue-jsx-best-practices

  Use when writing Vue with JSX/TSX — render functions, class vs className differences from React, and JSX / Babel plugin config in a Vue project.

• vue-options-api-best-practices

  Use when writing or reviewing Vue in Options API style — data() / methods / computed / watch and `this` context, typically a legacy codebase that cannot move to Composition API. For Composition-API-first idioms use vue-best-practices.

• vue-pinia-best-practices

  Use when deciding Pinia store design — store boundaries and when to split, state-shape patterns, getter/action anti-patterns, and reactivity pitfalls. For Pinia API syntax and how-to use the pinia skill.

• vue-router-best-practices

  Use when working with Vue Router 4 — navigation guards, route params, and route-component lifecycle interactions.

• vue-testing-best-practices

  Use when testing Vue components with Vue Test Utils — mounting, props/events/slots, async updates, and component-level mocking. For Vitest runner mechanics use the vitest skill; for E2E and test-strategy decisions use frontend-testing-best-practices.

• vue

  Vue 3 Composition API, script setup macros, reactivity system, and built-in components. Use when writing Vue SFCs, defineProps/defineEmits/defineModel, watchers, or using Transition/Teleport/Suspense/KeepAlive.

• vueuse-functions

  Use when building Vue.js / Nuxt features that an existing VueUse composable already covers, instead of hand-rolling the same reactive utility.

• web-design-guidelines

  Review UI code for Web Interface Guidelines compliance. Use when asked to "review my UI", "check accessibility", "audit design", "review UX", or "check my site against best practices".

Subagents (1)

• vue-engineer

  Senior frontend engineer specializing in the Vue ecosystem (Nuxt SSR, Vue 3 Vite SPA, legacy Vue 2, single-spa). Handles UI components, pages, composables, Pinia stores, styling, build tooling, and frontend testing. - agent-guidelines - engineering-checklist - frontend-checklist - vue-best-practices

Similar plugins