Vue + Nuxt

Full SFC support. VibeCode QA extracts <script> for logic analysis and scans templates for security + accessibility.

Quick Start

npx @vibecodeqa/cli

Set up CI + auto-fix

npx @vibecodeqa/cli init    # creates .github/workflows/vibecodeqa.yml
npx @vibecodeqa/cli fix     # auto-fix lint issues + show fix suggestions

Auto-detects: vue or nuxt in dependencies, Vite bundler, vitest/jest test runner.

How .vue Files Are Analyzed

Part of SFC	What's Checked
`<script setup>`	Type safety, complexity, duplication, error handling, imports, architecture graph
`<template>`	Accessibility (img alt, click handlers), Security (v-html XSS)
`<style>`	Not analyzed (CSS is out of scope)

Vue-Specific Patterns We Catch

Security

Pattern	Severity	Why
`v-html="..."`	Warning (CWE-79)	Renders raw HTML — equivalent to React's dangerouslySetInnerHTML. Sanitize user input with DOMPurify.

Accessibility

Pattern	Severity	Why
`<div @click>` without `role` + `@keydown`	Warning	Non-interactive elements with click handlers exclude keyboard users.
`<img>` without `alt`	Error	Images without alt text are invisible to screen readers.
`autofocus`	Warning	Disorients screen reader users.

All Standard Checks Apply

Complexity, duplication, error handling, secrets, dependencies, architecture — all work on the extracted <script> content. Vue files appear in the import graph and architecture diagrams.

Nuxt-Specific

Nuxt is detected via nuxt in dependencies. When found:

Framework reported as "vue" (Nuxt is a Vue meta-framework)
Bundler auto-detected (Nuxt handles its own bundling via Vite/webpack)
.nuxt/ directory excluded from scanning
app/ directory included in source roots

Recommended Tool Setup

# Core
pnpm add -D typescript @biomejs/biome vitest

# Vue-specific ESLint (optional — enables deeper checks in lint runner)
pnpm add -D eslint eslint-plugin-vue

# Security
brew install gitleaks

# E2E
pnpm add -D @playwright/test

What We Don't Cover (Yet)

Vue-specific lint rules (eslint-plugin-vue handles these when installed)
Composition API vs Options API migration detection
v-for without :key (planned — currently only React's missing key is checked)
Pinia/Vuex store patterns
Scoped CSS analysis

Home · Tool Decisions · TS + React · Node.js · Flutter