Nuxt Minimal Starter
Look at the Nuxt documentation to learn more.
Setup
Make sure to install dependencies:
# npm
npm install
# pnpm
pnpm install
# yarn
yarn install
# bun
bun install
Development Server
Start the development server on http://localhost:3000:
# npm
npm run dev
# pnpm
pnpm dev
# yarn
yarn dev
# bun
bun run dev
Production
Build the application for production:
# npm
npm run build
# pnpm
pnpm build
# yarn
yarn build
# bun
bun run build
Locally preview production build:
# npm
npm run preview
# pnpm
pnpm preview
# yarn
yarn preview
# bun
bun run preview
Check out the deployment documentation for more information.
Use Pixelmapper from Claude Code / Claude Desktop
Claude drives the running app through the MCP server pixelmapper-mcp (packages/mcp-bridge). The app connects to it over ws://127.0.0.1:7778, and the tools run inside the app: every change is one undo step labelled AI: ….
- Register the server.
- Get the pairing token:
bun run mcp token (created once in ~/.pixelmapper/mcp-token).
- Start the app:
- Web:
bun run dev and open http://localhost:3000.
- Desktop:
bun run dev:tauri.
- Pair: open Settings → MCP Server (gear icon in the header, ⌘, or, in the desktop app, the menu MCP → MCP Server Setup…), turn it on and paste the token. The desktop app finds the token on this computer and offers Use it. The status should say Connected. The panel (and the MCP menu) also copies the ready-made Claude Code command and Claude Desktop config.
- Ask Claude, for example: "Inspect the project and add a slow rainbow wave on the left group."
Claude works in this order: inspect the project, then operations / describe, then apply with dryRun and expect, then observe the output. describe with guide:plugin-authoring teaches it to write new content plugins.
Only one app window is connected at a time; the most recently enabled one wins.
