stefanBid/sb-context-nuxt

Claude Code plugin for **Nuxt 4 + Tailwind 4 projects already in progress**. This README is the user guide: every skill, when to use it, what to say to trigger it, what it reads and writes.
It does two things:
1. **Aligns** the project to one fixed way of organizing the global style, normalizing whatever divergent setup it finds, optionally taking the values from a design made in Claude.
2. **Maintains** the project with a precise, repeatable way of working: template migration, UI extraction from a design, health checks, GitHub management.
It does **not** judge or improve the design. That is the job of Impeccable, a separate plugin. The two are not connected.
---
Table of contents
- Quick start
- Install
- Update
- First run on a project
- How the plugin works
- Invocation: command or natural language
- Language
- Confirmation stops
- Where things live
- Requirements
- Skills at a glance
- Which skill do I need?
- Trigger phrases cheat sheet
- Workflows
- Join a project in progress
- Start from a design made in Claude
- The design changed in Claude
- Bring a component or a page from the design
- Daily health check
- Set up the GitHub side
- Skill reference: style
- design-extract-style
- style-align
- style-migrate
- design-extract-ui
- Skill reference: onboarding and checks
- onboard
- setup
- full-checkup
- lint-check
- build-check
- seo-check
- dependency-check
- docs-update
- Skill reference: GitHub
- gh-admin
- gh-checks
- Project settings
- Keys
- The i18n stance
- The global style
- The four files
- What is fixed and what follows the design
- Hard rules
- Local files and scripts
- The .sb-context-nuxt folder
- Scripts
- Exit codes of sync-values
- Impeccable (design quality)
- Troubleshooting and FAQ
- Reliability
- Contributing and releases
---
Quick start
Install
Update
Pin a version by keeping version in .claude-plugin/plugin.json unchanged until you want a release.
First run on a project
Open Claude Code in the Nuxt project and run:
It checks the stack, settles the project settings, aligns the global style, migrates the templates, builds and recommends next steps. It stops at every confirmation. Details: onboard.
Project **already aligned**, or you only want the plugin to know it? Run /sb-context-nuxt:setup instead: it creates the local folder, asks the missing settings and reports what to run next, without touching the style or the templates. Details: setup.
---
How the plugin works
Invocation: command or natural language
Every skill has a slash command /sb-context-nuxt: . Most skills can also be **triggered by natural language**: say what you want and Claude loads the matching skill. Three skills are **command only** because they change a lot at once: onboard, style-migrate, full-checkup.
| Invocation | Skills | How to use |
| --- | --- | --- |
| **Command only** | onboard, style-migrate, full-checkup | Type the slash command. Saying "full checkup" in chat will not load them by itself. |
| **Model or command** | all the others | Type the slash command, or write a request that matches the skill's trigger phrases. |
Skills that take an argument show a hint when you type the command: design-extract-style [link or name], design-extract-ui [what to extract] [link], style-migrate [files or folders].
Language
Talk to Claude in your language. The skill files are in English, but questions, reports and summaries come back in the language you use. Trigger phrases work in **English or Italian** (see the cheat sheet). PR titles and descriptions are always English.
Confirmation stops
Reading is free; writing asks first.
| Skill | Stops before |
| --- | --- |
| style-align | writing the four CSS files, installing modules, applying synced values, renaming the prefix |
| style-migrate | applying the refactor (you pick the areas first) |
| design-extract-style | writing design-source.md |
| design-extract-ui | replacing an existing component, naming new files |
| gh-admin, gh-checks | any write to the remote: rulesets, labels, settings, pushes, PRs, releases |
| dependency-check | the scope (minor/patch or also major) and the approval of every major migration plan |
| onboard | every confirmation of the skills it calls |
| setup | nothing outside .sb-context-nuxt/ is written; the settings are asked before they are saved |
Where things live
| What | Where |
| --- | --- |
| Global style (the only place the plugin writes CSS) | /assets/css/ (app/assets/css/ in Nuxt 4) |
| Plugin's own local files | /.sb-context-nuxt/ (kept out of git) |
| Project root | the folder with nuxt.config.*, found from wherever a script starts |