@kekkai/blueprintArchitecture as Code

Translates your frontend design philosophy into ESLint rules, a human-readable handbook, ground rules for AI agents, and a CI gate.

Get Started

Feature Overview

Philosophy

API Reference

🧱

Enforce

emitLint compiles the layer flow, module boundaries, and ownership rules into an ESLint flat config — with an embedded plugin, nothing extra to install.

See the generated config

📖

Explain

emitHandbook renders a human handbook (markdown + mermaid) that cannot drift from the rules, because both compile from the same source.

See the handbook

🤖

Collaborate

emitAgentFiles distributes one agent operating contract across CLAUDE.md, AGENTS.md, Cursor, Windsurf, and more.

See the contract

🚦

Gate

emitCi renders a GitHub Actions workflow — lint plus a read-only architecture report, exit 1 on violations.

See the workflow

🧭

Adopt

The brownfield flow — survey collects the evidence, your own agent authors the config, and the baseline ratchet locks today's debt so it only tightens.

See the adoption flow

🔎

Verify

Read-only runtimes on the same source — inspect judges the architecture (nine finding kinds, CI-gateable), deps answers "who gets hit if I change this".

See what gets caught

One source, everything compiled

blueprint.config.mjs

→

eslint.config.mjs Enforce — structural rules + embedded plugin

docs/architecture-handbook.md Explain — the handbook humans read

CLAUDE.md · AGENTS.md · … Collaborate — ground rules for AI agents

.github/workflows/blueprint-ci.yml Gate — lint + inspect in CI

inspect · deps Verify — read-only runtimes on the same source

Edit the config, regenerate, and every artifact moves together — they cannot drift, because they are all translations of the same source. See them verbatim in What init Generates.

Why

AI agents write code fast — but where a file goes, and who may import whom, rides on whatever the agent happens to hold in context. Meanwhile the architecture doc, the ESLint config, and CLAUDE.md are three hand-maintained documents that inevitably stop telling the same story.

blueprint collapses them into one config: what the rules say is what lint blocks, what the handbook explains, and what the agent holds.

Hand it to your agent

Brownfield repo, fully automated? Paste this to your agent:

text

Help adopt @kekkai/blueprint in this repo, autonomously:
run `npx @kekkai/blueprint init --authoring`,
then execute the blueprint-authoring.md it writes, fully and to the end.

Acceptance (`blueprint doctor` passes):
- lint, `inspect --baseline`, and the existing tests all pass
- emitLint genuinely wired into ESLint (no leftover reference files)
- no source edits — lock existing debt: `inspect --update-baseline` for
  architecture, `eslint --suppress-all` for lint

What each acceptance clause guards, and the full flow: AI-Assisted Adoption.

Works better together

Blueprint owns the architecture layer of an agent's context — where code goes, what imports what, which judgments the agent must hold. Two companions cover the layers it deliberately leaves to others:

Companion	What it adds
vercel-labs/agent-skills	Curated, installable skills for coding agents — framework and tooling best practices that sit alongside the blueprint contract, so the agent gets your structure rules and the ecosystem's idioms.
vuejs/docs	The official Vue documentation source. Point your agent at it (clone it locally, or wire it in as a reference source) for API ground truth — pairs especially well with the Vue preset.

One contract for where code goes (blueprint), one skill pack for how the framework is used well (agent-skills), one authoritative reference for what the API actually is (official docs) — three inputs that barely overlap, and together they close most of the gap between "it compiles" and "it's good".