Easy way to use process.env in your Remix apps
npm install remix-env1. Run npm install remix-env or yarn add remix-env
2. Add EnvProvider in entry.client.tsx and entry.server.tsx
#### entry.client.tsx
``diff`
startTransition(() => {
hydrateRoot(
document,
+
+
);
});
#### entry.server.tsxdiff`
export default function handleRequest(
request: Request,
responseStatusCode: number,
responseHeaders: Headers,
remixContext: EntryContext
) {
const markup = renderToString(
+
+
);
}
3. Add in root.tsx
#### root.tsxdiff`
export function Root() {
return (
+
);
}
Now, You can use the getEnv to get your env`tsx
const env = getEnv()
// app/routes/_index.tsx
export default function IndexRoute() {
return (
Configuration
By default this library will inject all environment variables with prefix
to the browser.But you can customize it by provide the filter function at
EnvProvider.`tsx
key.startsWith("PUBLIC_ENV_")}>
...
``