Vite
Load Cite only when import.meta.env.DEV is true. Works for React, Vue, Svelte, and Solid apps on Vite.
<script type="module">
if (import.meta.env.DEV) {
const s = document.createElement("script");
s.src = "https://cite.brijr.dev/cite.js";
s.dataset.project = "your-site";
document.body.append(s);
}
</script>
Install
Copy this into Claude, Cursor, or Codex.
Add Cite to this Vite project for local development only. Never ship it to production.
Cite: https://cite.brijr.dev/cite.js
Docs: https://cite.brijr.dev/vite
One script. It overlays the page so you can click an element, describe the change, and copy a bundle (selector, HTML, computed CSS, nearby DOM, request) into a coding agent.
In index.html (or the root layout), inject the script only when import.meta.env.DEV is true. Do not import cite.js as a module so Vite does not bundle it.
<script type="module">
if (import.meta.env.DEV) {
const s = document.createElement("script");
s.src = "https://cite.brijr.dev/cite.js";
s.dataset.project = "PROJECT";
document.body.append(s);
}
</script>
Replace PROJECT with this repo's name. data-project namespaces localStorage.
Optional: vendor https://cite.brijr.dev/cite.js into public/cite.js and load /cite.js instead.
Verify with the Vite dev server: Cmd+Shift+F (Ctrl+Shift+F on Windows) opens Cite. A circle marked => appears in the bottom right.
Do not add a package, backend, or auth. Do not load Cite in production.
Verify
Run the Vite dev server. Press Cmd+Shift+F. A circle marked => appears in the bottom right.