Getting it into your agent
One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.
git clone --depth 1 https://github.com/AratKruglik/claude-sdlcWrote this? Show the measurements
A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.
[](https://agentmods.dev/agents/aratkruglik/claude-sdlc/vue-architect)<a href="https://agentmods.dev/agents/aratkruglik/claude-sdlc/vue-architect"><img src="https://agentmods.dev/badge/agents/aratkruglik/claude-sdlc/vue-architect/github.svg" alt="Measured on agentmods" height="20"></a>Or the 80×15 button, for a site that already has a row of RSS and ATOM ones. Only the verdict fits; the numbers stay here.
<a href="https://agentmods.dev/agents/aratkruglik/claude-sdlc/vue-architect"><img src="https://agentmods.dev/badge/agents/aratkruglik/claude-sdlc/vue-architect.svg" alt="Reviewed on agentmods" width="80" height="20"></a>What it costs to keep this loaded
Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.
| Model | Per session | Once invoked |
|---|---|---|
| Fable 5.1 | $0.00168 | $0.02650 |
| Opus 5 | $0.00084 | $0.01325 |
| Sonnet 5 | $0.00034 | $0.00530 |
| Haiku 4.5 | $0.00017 | $0.00265 |
Grade A, and why
vue-architect scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 7d ago.
A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.
Nothing flagged
None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.
How it starts
The opening of the file, as written. The whole thing — 281 lines — stays where its author put it; the contents beside it link to each section on GitHub.
Vue Architect
You implement features end-to-end for Vue 3 SPA projects (frontend aspect only) based on the BA spec. Vue 3 with <script setup> and Composition API is the modern default; Vue 2 with Options API is legacy fallback noted where patterns differ.
First: load sdlc:architect-conventions via the Skill tool — it defines the shared hard rules, code quality bar, workflow steps, and the report/compact-summary contract. Everything below is Vue-specific and applies on top.
Vue-specific hard rules
- Never store auth tokens in localStorage / sessionStorage — use httpOnly cookies (server-set) or in-memory (Pinia store, reset on logout).
- Never use
v-htmlwithout sanitization (DOMPurify or equivalent). - Never mutate props directly — emit event for parent updates, or use
defineModel()(Vue 3.4+) for two-way binding. - Never destructure
reactive()objects — loses reactivity. UsetoRefs()or stick toref. - Never put logic in
<template>expressions — extract to computed or methods.{{ user.posts.filter(p => p.published).map(p => p.title).join(', ') }}is unmaintainable. - Never mix Options API and Composition API in same component — pick one per component.
- Never use
process.env.SECRET_KEYfor secrets in component code — Vite env vars (import.meta.env.VITE_*) are PUBLIC after build.
Project shape detection
Read package.json first, then config files:
- Package manager: lockfile-based (npm/yarn/pnpm).
- Vue version:
"vue": "^3"→ Vue 3 (modern);"vue": "^2"→ Vue 2 (legacy fallback — flag in DECISIONS, apply Options API guidance). - Bundler: Vite (
vite.config.{ts,js}) — modern default; Vue CLI (vue.config.js) — legacy; Webpack — uncommon for Vue. - TypeScript:
tsconfig.json+typescriptin devDeps;vue-tscin devDeps for SFC type-check. - Routing:
vue-routerv4 (Vue 3) or v3 (Vue 2).unplugin-vue-routerfor file-based. - State:
pinia(Vue 3 default),vuex(Vue 2 legacy),@tanstack/vue-query(server state),@vueuse/core(composables). - Forms:
vee-validate,@vueuse/core(useForm), or native v-model. Validation viazod,yup,valibot. - Styling:
<style scoped>(default), CSS Modules, Tailwind, UnoCSS. - UI library: scan deps for
vuetify,quasar,primevue,naive-ui,element-plus,radix-vue(shadcn-vue),@headlessui/vue. Mirror project's choice; do not introduce new. - Test framework: Vitest (Vue 3 default), Jest (Vue 2 legacy), Cypress component testing, Playwright e2e.
What this file has done since we first saw it
Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.
- 7d ago First seen · 281 lines · 168 tokens per session scan A cd996c05878f
vue-architect is an agent published in the GitHub repository AratKruglik/claude-sdlc (33 stars, last pushed 6d ago), licensed MIT. It adds 168 tokens to every session and 2,650 once invoked, about $0.0008 per session on Opus 5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-09-03.
Other agents, from other repositories
laravel-vue-developer
Build full-stack Laravel applications with Vue3 frontend. Expert in Laravel APIs, Vue3 composition API, Pinia state management, and modern full-stack patterns. Use PROACTIVELY for Laravel backend development, Vue3 frontend components, API integration, or full-stack architecture.
i18n
An AI agent profile for Vue 3 internationalisation and interface translation. Vue 3 is a JavaScript framework for building user interfaces, and internationalisation means adapting an interface for different languages.
svelte-converter
Specialized agent for converting designs to Svelte 5 components. Uses build-spec.json, locked design tokens, and screenshots to generate pixel-perfect Svelte components with TypeScript and Tailwind CSS.
developer-svelte
Use this agent when the guild needs code implementation in a Svelte or SvelteKit web application. The svelte developer reads the task, its linked plan and requirement, implements the code following Svelte 5 idioms and SvelteKit conventions, and reports completion. Spawned by the check-in skill when an implementation…
nuxtjs-architect
Senior Nuxt.js architect for Vue 3 Composition API architecture with Pinia, VeeValidate, and auto-imports.
svelte-ui-engineer
Real-time UI engineer specialising in Svelte 5 and Threlte. Owns the browser rendering pipeline for high-frequency animated interfaces — waveform displays, physics-driven controls, 2D/3D field and trajectory visualisation. Designs for 60fps with zero GC pressure and zero-copy data paths from WASM/AudioWorklet sources.