z3tz3r0 5108b20954
feat(rules): add vue and nuxt rule sets (#2250)
* feat(rules): add vue and nuxt rule sets

Add rules/vue/ and rules/nuxt/, each with the standard 5-file layout (coding-style, hooks, patterns, security, testing) that extends common/, following the Adding a New Language convention in rules/README.md.

Vue rules reference the frontend-patterns and vite-patterns skills. Nuxt rules reference the nuxt4-patterns and vite-patterns skills. Content is concise (1.5 to 4 KB per file) since rules load as always-on context.

* fix(rules): address PR review on vue and nuxt rule sets

- nuxt/coding-style: generalize the srcDir-override note (drop project-specific 'this repo' phrasing so it is correct for any Nuxt project).

- vue/hooks: add **/*.ts and **/*.tsx to paths so the lint/typecheck guidance loads when editing composables and stores.

- nuxt/hooks: add **/*.vue to paths (covers pages/layouts/components) and wrap nuxi typecheck in a timeout, mirroring web/hooks.md.

- nuxt/security: tighten the /security-review auto-trigger scope to external fetch, credential handling, and sensitive mutations, with examples.

- nuxt/testing: correct 'Vitest-only' to note built-in Playwright E2E, and drop the @nuxt/test-utils version pin.

- README: register vue and nuxt in the structure tree and install examples.

Skipped: 'X specific' -> 'X-specific' hyphenation (all existing rule sets use the unhyphenated form, changing only vue/nuxt would be inconsistent); repeating the 80%/TDD mandate in nuxt/testing (already inherited from common/testing.md).
2026-06-15 14:01:38 -04:00

1.9 KiB

paths
paths
**/*.vue

Vue Security

This file extends common/security.md with Vue specific content.

What Vue Escapes Automatically

  • Text interpolation {{ }} and dynamic attribute bindings (:title) are auto-escaped. The vectors below are NOT protected.

Rule No.1: Templates from Trusted Sources Only

  • Never use non-trusted content as a component template. No runtime template compilation from user input.
  • No user-controlled :is that resolves a component from an arbitrary string.

v-html and Render Functions

  • v-html bypasses escaping and is a direct XSS vector. Avoid it on user content.
  • If unavoidable, sanitize with DOMPurify (allowlist config) before binding, or render in a sandboxed iframe. Vue itself recommends sanitizing on the backend before persisting.
  • Render-function and scoped-slot output carry the same risk. Passing user HTML through h() with innerHTML is v-html by another name. Sanitize first.

URL, Style, and Event Injection

  • :href and :src are not escaped. javascript: URLs execute. Validate the scheme, allow http / https / mailto only. Vue docs reference @braintree/sanitize-url, but sanitize on the backend before persisting.
  • :style with user input is unsafe (CSS exfiltration). Use object syntax with whitelisted properties, never a raw user string.
  • Never bind user input to onclick, onfocus, or any event attribute.

Client Bundle Secrets

  • Anything in import.meta.env.VITE_* ships to the browser. Keep API keys and tokens server-side.
  • Use httpOnly cookies for session tokens. Never bundle credentials into the client.
<!-- unsafe -->
<div v-html="userBio" />
<!-- safe -->
<div v-html="sanitize(userBio)" />

Reference