fixdog

> Turn live UI edits into reviewable GitHub pull requests

Quick Start

The easiest way to set up fixdog is using the CLI:

``bash
npx fixdog init
`

The CLI will:

- Detect your framework (Vite or Next.js)
- Prompt for your project ID (get it from app.fix.dog)
- Automatically inject the fixdog script into your project
- For Vite projects: Update vite.config.ts/js/mjs to add projectId.fix.dog to allowedHosts

$3

For CI/CD or automation:

`bash
npx fixdog init --projectId your-project-id --yes
`

CLI Options:

- --projectId, --project-id, -p - Project ID (non-interactive mode)
- --yes, -y - Skip confirmation prompt
- --silent, -s - Silent mode (no output except errors)
- --help, -h - Show help message

Manual Setup

If you prefer to set up manually, see the integration guide or visit fix.dog for detailed documentation.

$3

Add to your index.html inside :

`html

`

Also update your vite.config.ts (or .js/.mjs) to add the project host to allowedHosts:

`ts
import { defineConfig } from "vite";
import react from "@vitejs/plugin-react";

export default defineConfig({
plugins: [react()],
server: {
allowedHosts: ["your-project-id.fix.dog"],
},
});
`

$3

Add to your app/layout.tsx:

`tsx
export default function RootLayout({ children }) {
return (


{process.env.NODE_ENV === "development" && (
type="module"
src="https://unpkg.com/fixdog/dist/fixdog.esm.js?projectId=your-project-id"
/>
)}

{children}

);
}
`

$3

Add to your pages/_document.tsx:

`tsx
import { Html, Head, Main, NextScript } from "next/document";

export default function Document() {
return (


{process.env.NODE_ENV === "development" && (
type="module"
src="https://unpkg.com/fixdog/dist/fixdog.esm.js?projectId=your-project-id"
/>
)}