3 replies

Setting up public env vars in t3 app

I am following the docs (https://create.t3.gg/en/usage/env-variables) for setting up env vars in a t3 app. I have successfully added server env vars but I am having trouble adding client env vars. I am getting the following error

Invalid environment variables: { NEXT_PUBLIC_NEXTAUTH_URL: ["Required"] }

Invalid environment variables: { NEXT_PUBLIC_NEXTAUTH_URL: ["Required"] }

even though I have this var set up. If I log the

env

env

object it seems to be there.

Here are my

client

client

and

runtimeEnv

runtimeEnv

objects in my

env.mjs

env.mjs

file:

client: {
    // NEXT_PUBLIC_CLIENTVAR: z.string().min(1),
    NEXT_PUBLIC_NEXTAUTH_URL: z.string(),
  },
...
runtimeEnv: {
    DATABASE_URL: process.env.DATABASE_URL,
    NODE_ENV: process.env.NODE_ENV,
    NEXTAUTH_SECRET: process.env.NEXTAUTH_SECRET,
    NEXTAUTH_URL: process.env.NEXTAUTH_URL,
    NEXT_PUBLIC_NEXTAUTH_URL: process.env.NEXTAUTH_URL,
    GOOGLE_CLIENT_ID: process.env.GOOGLE_CLIENT_ID,
    GOOGLE_CLIENT_SECRET: process.env.GOOGLE_CLIENT_SECRET,
  },

client: {
    // NEXT_PUBLIC_CLIENTVAR: z.string().min(1),
    NEXT_PUBLIC_NEXTAUTH_URL: z.string(),
  },
...
runtimeEnv: {
    DATABASE_URL: process.env.DATABASE_URL,
    NODE_ENV: process.env.NODE_ENV,
    NEXTAUTH_SECRET: process.env.NEXTAUTH_SECRET,
    NEXTAUTH_URL: process.env.NEXTAUTH_URL,
    NEXT_PUBLIC_NEXTAUTH_URL: process.env.NEXTAUTH_URL,
    GOOGLE_CLIENT_ID: process.env.GOOGLE_CLIENT_ID,
    GOOGLE_CLIENT_SECRET: process.env.GOOGLE_CLIENT_SECRET,
  },

And here is

NEXTAUTH_URL

NEXTAUTH_URL

in my

.env

.env

file:

NEXTAUTH_URL="http://localhost:3000"

NEXTAUTH_URL="http://localhost:3000"

Any ideas what I am doing wrong?

Create T3 App

Environment Variables 🚀 Create T3 App

The best way to start a full-stack, typesafe Next.js app.

Setting up public env vars in t3 app

Invalid environment variables: { NEXT_PUBLIC_NEXTAUTH_URL: ["Required"] }

Invalid environment variables: { NEXT_PUBLIC_NEXTAUTH_URL: ["Required"] }

even though I have this var set up. If I log the

env

env

object it seems to be there.

Here are my

client

client

and

runtimeEnv

runtimeEnv

objects in my

env.mjs

env.mjs

file:

client: {
    // NEXT_PUBLIC_CLIENTVAR: z.string().min(1),
    NEXT_PUBLIC_NEXTAUTH_URL: z.string(),
  },
...
runtimeEnv: {
    DATABASE_URL: process.env.DATABASE_URL,
    NODE_ENV: process.env.NODE_ENV,
    NEXTAUTH_SECRET: process.env.NEXTAUTH_SECRET,
    NEXTAUTH_URL: process.env.NEXTAUTH_URL,
    NEXT_PUBLIC_NEXTAUTH_URL: process.env.NEXTAUTH_URL,
    GOOGLE_CLIENT_ID: process.env.GOOGLE_CLIENT_ID,
    GOOGLE_CLIENT_SECRET: process.env.GOOGLE_CLIENT_SECRET,
  },

client: {
    // NEXT_PUBLIC_CLIENTVAR: z.string().min(1),
    NEXT_PUBLIC_NEXTAUTH_URL: z.string(),
  },
...
runtimeEnv: {
    DATABASE_URL: process.env.DATABASE_URL,
    NODE_ENV: process.env.NODE_ENV,
    NEXTAUTH_SECRET: process.env.NEXTAUTH_SECRET,
    NEXTAUTH_URL: process.env.NEXTAUTH_URL,
    NEXT_PUBLIC_NEXTAUTH_URL: process.env.NEXTAUTH_URL,
    GOOGLE_CLIENT_ID: process.env.GOOGLE_CLIENT_ID,
    GOOGLE_CLIENT_SECRET: process.env.GOOGLE_CLIENT_SECRET,
  },

And here is

NEXTAUTH_URL

NEXTAUTH_URL

in my

.env

.env

file:

NEXTAUTH_URL="http://localhost:3000"

NEXTAUTH_URL="http://localhost:3000"

Any ideas what I am doing wrong?

Create T3 App

Environment Variables 🚀 Create T3 App

The best way to start a full-stack, typesafe Next.js app.

Setting up public env vars in t3 app

Similar Threads

Setting up public env vars in t3 app

Similar Threads

Similar Threads

Similar Threads