Scaffold + manual step. Remix doesn’t expose environment variables to
the browser automatically — you have to surface them via a loader. The CLI
writes the LucentInit component but leaves the loader wiring to you.
Install with the CLI
Pick Remix when prompted.
Manual setup
LucentInit component
app/components/lucent-init.tsx:Expose the key via the root loader (manual)
Notes
- Remix never ships
process.env to the browser. The loader pattern is the
canonical way to expose public keys; don’t try to read process.env
directly from a client component.
LucentInit renders nothing — it only exists to run the tracker inside a
useEffect so it initializes on mount and stops on unmount.
- Prefix the env var with
LUCENT_ (no public prefix) because it’s consumed
server‑side by the loader before being handed to the client.