Root causes::

CommonJS interop: react-microsoft-clarity is published as CommonJS. With Vite (ESM-first), named imports like import { clarity } from 'react-microsoft-clarity' won’t work. You’ll see “Named export 'clarity' not found.”

SSR/top-level execution: Calling clarity.init at module top-level (e.g., in app/root.tsx) runs during SSR/build or in environments where window isn’t defined, causing “window is not defined.”

Recommended fixes::

Only initialize Clarity in the browser, after mount (inside useEffect).
Dynamically import the package to avoid CJS named export issues and to ensure code only runs client-side.
Use only Vite’s import.meta.env.VITE_* for client-accessible env vars.