Spotnote

Let designers and reviewers write notes on a staging or preview deploy, and hand them to a developer and their agent.

Spotnote runs only in vite dev by default. With the build option, it also runs in builds you deploy for review, such as a staging or preview environment. Anyone who opens it can write notes, and each prompt names the file, the line and the commit the build was made from.

How it works

The reviewer opens the staging site, clicks an element, writes the note and presses Enter. The prompt is on their clipboard.
They paste it where your team tracks feedback: an issue, a pull request, a chat thread. Or the webhook sends it there as they press Enter.
The developer gives it to their agent, which goes straight to that file and line.

Not for production

A build with Spotnote shows your source paths and component names to everyone who can open it. Turn it on only for builds that aren't public.

Set up

List the modes to turn it on for

vite.config.ts

export default defineConfig({
  plugins: [react(), spotnote({ build: ['staging', 'preview'] })],
});

Build in that mode

vite build --mode staging

Your production build (vite build, mode production) stays without Spotnote: never list that mode.

The commit in the prompt

The prompt has one more line than in dev, under the location:

- file: components/ProductCard.jsx
- line: 7, column: 5
- commit: 3f38973 (the deployed build: if the file has changed since, compare with git show 3f38973:components/ProductCard.jsx)

Your branch may have moved on since the build, so the agent can look up the line at that commit and find it in today's code.

The commit comes from Git. Without the repository's history in the build, it's read from GITHUB_SHA, VERCEL_GIT_COMMIT_SHA, CF_PAGES_COMMIT_SHA or COMMIT_REF (Netlify).

What's different from dev

No MCP. A deployed page can't reach spotnote-mcp on your machine, so notes travel by copy and paste, or by the webhook.
Notes stay in the reviewer's browser. Others opening the site don't see them. See Storage.
File links don't open your editor: there's no dev server to open them.

Prompt Format: every line of the prompt.

Staging Builds