Getting Started

The fastest way to set up Domscribe is the interactive setup wizard.

Run the Wizard

npx domscribe init

The wizard walks you through two steps:

1. Connect your coding agent -- select your agent (Claude Code, Copilot, Cursor, Gemini, Kiro, or others) and the wizard installs the plugin automatically.
2. Add to your app -- select your framework and bundler, the wizard installs the right package and shows you the config snippet to add.

That is it. Start your dev server and you are ready to go.

What the Wizard Does

When you run npx domscribe init, the wizard:

• Detects your project structure (monorepo or single app)
• Asks you to choose your coding agent and installs the MCP plugin
• Asks you to choose your framework (React, Vue, Next.js, or Nuxt) and bundler (Vite, Webpack, or Turbopack)
• Installs the correct @domscribe/* package as a dev dependency
• Prints the configuration snippet you need to add to your bundler config

Example Output

$ npx domscribe init

  Domscribe Setup Wizard

? Select your coding agent: Claude Code
  Installing domscribe plugin for Claude Code... done

? Select your framework: Next.js
  Installing @domscribe/next... done

  Add this to your next.config.ts:

    import { withDomscribe } from '@domscribe/next';

    const nextConfig = {};
    export default withDomscribe()(nextConfig);

  Start your dev server and open the page in your browser.

Monorepos

If your frontend app lives in a subdirectory (for example apps/web), pass --app-root during init:

npx domscribe init --app-root apps/web

This creates a domscribe.config.json at your repo root that tells all Domscribe tools where your app lives. CLI commands (serve, stop, status) and agent MCP connections automatically resolve the app root from this config.

Important: Dev Server Must Be Running

For Domscribe to work, your dev server must be running and the target page must be open in a browser. The runtime overlay and agent tools communicate with the browser via a localhost relay daemon that starts automatically when your dev server boots.

Next Steps

• Manual Setup -- for users who need finer control
• Frameworks -- framework-specific configuration guides
• Agents -- agent-specific setup instructions