In this article, we are going to examine the EnvOptions type in T3 Env source code. In case you are wondering what’s T3 Env or EnvOptions,
.
// src/env.mjs
import { createEnv } from "@t3-oss/env-nextjs";
import { z } from "zod";
export const env = createEnv({
/*
* Serverside Environment variables, not available on the client.
* Will throw if you access these variables on the client.
*/
server: {
DATABASE_URL: z.string().url(),
OPEN_AI_API_KEY: z.string().min(1),
},
/*
* Environment variables available on the client (and server).
*
* 💡 You'll get type errors if these are not prefixed with NEXT_PUBLIC_.
*/
client: {
NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY: z.string().min(1),
},
/*
* Due to how Next.js bundles environment variables on Edge and Client,
* we need to manually destructure them to make sure all are included in bundle.
*
* 💡 You'll get type errors if not all variables from `server` & `client` are included here.
*/
runtimeEnv: {
DATABASE_URL: process.env.DATABASE_URL,
OPEN_AI_API_KEY: process.env.OPEN_AI_API_KEY,
NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY:
process.env.NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY,
},
});
export type EnvOptions<
TPrefix extends string | undefined,
TServer extends Record<string, ZodType>,
TClient extends Record<string, ZodType>,
TShared extends Record<string, ZodType>,
TExtends extends Array<Record<string, unknown>>,
> =
| (LooseOptions<TShared, TExtends> &
ServerClientOptions<TPrefix, TServer, TClient>)
| (StrictOptions<TPrefix, TServer, TClient, TShared, TExtends> &
ServerClientOptions<TPrefix, TServer, TClient>);
EnvOptions is a generic type. Server object in opts passed has the generic type — TServer extends Record<string, ZodType>
// server type is TServer that is a Record with key being string
// and value being ZodType
server: {
DATABASE_URL: z.string().url(),
OPEN_AI_API_KEY: z.string().min(1),
},
// client type is TClient that is a Record with key being string
// and value being ZodType
client: {
NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY: z.string().min(1),
},
I barely scratched the surface here, this feels like an advanced Typescript usecase as this EnvOptions type returns:
| (LooseOptions<TShared, TExtends> &
ServerClientOptions<TPrefix, TServer, TClient>)
| (StrictOptions<TPrefix, TServer, TClient, TShared, TExtends> &
ServerClientOptions<TPrefix, TServer, TClient>);
Check out the in t3-env source code.
About us:
At . We have developed reusable
References:
1.
3. https://env.t3.gg/
SOCIAL SHARE CARD GENERATOR