Skip to content

Commit 7490a34

Browse files
c-ehrlichc-ehrlich
authored
fix: undo env changes (#1084)
1 parent 5041f70 commit 7490a34

File tree

14 files changed

+240
-30
lines changed

14 files changed

+240
-30
lines changed

Diff for: ‎.changeset/fresh-melons-enjoy.md

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
"create-t3-app": patch
3+
---
4+
5+
fix: undo env changes

Diff for: ‎cli/template/base/src/env/client.mjs

+1-12
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,5 @@
11
// @ts-check
2-
import { clientSchema } from "./schema.mjs";
3-
4-
/**
5-
* You can't destruct `process.env` as a regular object, so we do
6-
* a workaround. This is because Next.js evaluates this at build time,
7-
* and only used environment variables are included in the build.
8-
* @type {{ [key: string]: string | undefined; }}
9-
*/
10-
let clientEnv = {};
11-
Object.keys(clientSchema.shape).forEach(
12-
(key) => (clientEnv[key] = process.env[key]),
13-
);
2+
import { clientEnv, clientSchema } from "./schema.mjs";
143

154
const _clientEnv = clientSchema.safeParse(clientEnv);
165

Diff for: ‎cli/template/base/src/env/schema.mjs

+19
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,15 @@ export const serverSchema = z.object({
99
NODE_ENV: z.enum(["development", "test", "production"]),
1010
});
1111

12+
/**
13+
* You can't destruct `process.env` as a regular object in the Next.js
14+
* middleware, so you have to do it manually here.
15+
* @type {{ [k in keyof z.infer<typeof serverSchema>]: z.infer<typeof serverSchema>[k] | undefined }}
16+
*/
17+
export const serverEnv = {
18+
NODE_ENV: process.env.NODE_ENV,
19+
};
20+
1221
/**
1322
* Specify your client-side environment variables schema here.
1423
* This way you can ensure the app isn't built with invalid env vars.
@@ -17,3 +26,13 @@ export const serverSchema = z.object({
1726
export const clientSchema = z.object({
1827
// NEXT_PUBLIC_CLIENTVAR: z.string(),
1928
});
29+
30+
/**
31+
* You can't destruct `process.env` as a regular object, so you have to do
32+
* it manually here. This is because Next.js evaluates this at build time,
33+
* and only used environment variables are included in the build.
34+
* @type {{ [k in keyof z.infer<typeof clientSchema>]: z.infer<typeof clientSchema>[k] | undefined }}
35+
*/
36+
export const clientEnv = {
37+
// NEXT_PUBLIC_CLIENTVAR: process.env.NEXT_PUBLIC_CLIENTVAR,
38+
};

Diff for: ‎cli/template/base/src/env/server.mjs

+1-12
Original file line numberDiff line numberDiff line change
@@ -3,20 +3,9 @@
33
* This file is included in `/next.config.mjs` which ensures the app isn't built with invalid env vars.
44
* It has to be a `.mjs`-file to be imported there.
55
*/
6-
import { serverSchema } from "./schema.mjs";
6+
import { serverSchema, serverEnv } from "./schema.mjs";
77
import { env as clientEnv, formatErrors } from "./client.mjs";
88

9-
/**
10-
* You can't destruct `process.env` as a regular object, so we do
11-
* a workaround. This is because Next.js evaluates this at build time,
12-
* and only used environment variables are included in the build.
13-
* @type {{ [key: string]: string | undefined; }}
14-
*/
15-
let serverEnv = {};
16-
Object.keys(serverSchema.shape).forEach(
17-
(key) => (serverEnv[key] = process.env[key]),
18-
);
19-
209
const _serverEnv = serverSchema.safeParse(serverEnv);
2110

2211
if (!_serverEnv.success) {

Diff for: ‎cli/template/extras/src/env/schema/with-auth-prisma.mjs

+24
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,20 @@ export const serverSchema = z.object({
2323
DISCORD_CLIENT_SECRET: z.string(),
2424
});
2525

26+
/**
27+
* You can't destruct `process.env` as a regular object in the Next.js
28+
* middleware, so you have to do it manually here.
29+
* @type {{ [k in keyof z.infer<typeof serverSchema>]: z.infer<typeof serverSchema>[k] | undefined }}
30+
*/
31+
export const serverEnv = {
32+
DATABASE_URL: process.env.DATABASE_URL,
33+
NODE_ENV: process.env.NODE_ENV,
34+
NEXTAUTH_SECRET: process.env.NEXTAUTH_SECRET,
35+
NEXTAUTH_URL: process.env.NEXTAUTH_URL,
36+
DISCORD_CLIENT_ID: process.env.DISCORD_CLIENT_ID,
37+
DISCORD_CLIENT_SECRET: process.env.DISCORD_CLIENT_SECRET,
38+
};
39+
2640
/**
2741
* Specify your client-side environment variables schema here.
2842
* This way you can ensure the app isn't built with invalid env vars.
@@ -31,3 +45,13 @@ export const serverSchema = z.object({
3145
export const clientSchema = z.object({
3246
// NEXT_PUBLIC_CLIENTVAR: z.string(),
3347
});
48+
49+
/**
50+
* You can't destruct `process.env` as a regular object, so you have to do
51+
* it manually here. This is because Next.js evaluates this at build time,
52+
* and only used environment variables are included in the build.
53+
* @type {{ [k in keyof z.infer<typeof clientSchema>]: z.infer<typeof clientSchema>[k] | undefined }}
54+
*/
55+
export const clientEnv = {
56+
// NEXT_PUBLIC_CLIENTVAR: process.env.NEXT_PUBLIC_CLIENTVAR,
57+
};

Diff for: ‎cli/template/extras/src/env/schema/with-auth.mjs

+23
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,19 @@ export const serverSchema = z.object({
2222
DISCORD_CLIENT_SECRET: z.string(),
2323
});
2424

25+
/**
26+
* You can't destruct `process.env` as a regular object in the Next.js
27+
* middleware, so you have to do it manually here.
28+
* @type {{ [k in keyof z.infer<typeof serverSchema>]: z.infer<typeof serverSchema>[k] | undefined }}
29+
*/
30+
export const serverEnv = {
31+
NODE_ENV: process.env.NODE_ENV,
32+
NEXTAUTH_SECRET: process.env.NEXTAUTH_SECRET,
33+
NEXTAUTH_URL: process.env.NEXTAUTH_URL,
34+
DISCORD_CLIENT_ID: process.env.DISCORD_CLIENT_ID,
35+
DISCORD_CLIENT_SECRET: process.env.DISCORD_CLIENT_SECRET,
36+
};
37+
2538
/**
2639
* Specify your client-side environment variables schema here.
2740
* This way you can ensure the app isn't built with invalid env vars.
@@ -30,3 +43,13 @@ export const serverSchema = z.object({
3043
export const clientSchema = z.object({
3144
// NEXT_PUBLIC_CLIENTVAR: z.string(),
3245
});
46+
47+
/**
48+
* You can't destruct `process.env` as a regular object, so you have to do
49+
* it manually here. This is because Next.js evaluates this at build time,
50+
* and only used environment variables are included in the build.
51+
* @type {{ [k in keyof z.infer<typeof clientSchema>]: z.infer<typeof clientSchema>[k] | undefined }}
52+
*/
53+
export const clientEnv = {
54+
// NEXT_PUBLIC_CLIENTVAR: process.env.NEXT_PUBLIC_CLIENTVAR,
55+
};

Diff for: ‎cli/template/extras/src/env/schema/with-prisma.mjs

+20
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,16 @@ export const serverSchema = z.object({
1010
NODE_ENV: z.enum(["development", "test", "production"]),
1111
});
1212

13+
/**
14+
* You can't destruct `process.env` as a regular object in the Next.js
15+
* middleware, so you have to do it manually here.
16+
* @type {{ [k in keyof z.infer<typeof serverSchema>]: z.infer<typeof serverSchema>[k] | undefined }}
17+
*/
18+
export const serverEnv = {
19+
DATABASE_URL: process.env.DATABASE_URL,
20+
NODE_ENV: process.env.NODE_ENV,
21+
};
22+
1323
/**
1424
* Specify your client-side environment variables schema here.
1525
* This way you can ensure the app isn't built with invalid env vars.
@@ -18,3 +28,13 @@ export const serverSchema = z.object({
1828
export const clientSchema = z.object({
1929
// NEXT_PUBLIC_CLIENTVAR: z.string(),
2030
});
31+
32+
/**
33+
* You can't destruct `process.env` as a regular object, so you have to do
34+
* it manually here. This is because Next.js evaluates this at build time,
35+
* and only used environment variables are included in the build.
36+
* @type {{ [k in keyof z.infer<typeof clientSchema>]: z.infer<typeof clientSchema>[k] | undefined }}
37+
*/
38+
export const clientEnv = {
39+
// NEXT_PUBLIC_CLIENTVAR: process.env.NEXT_PUBLIC_CLIENTVAR,
40+
};

Diff for: ‎www/src/pages/ar/usage/env-variables.md

+16-1
Original file line numberDiff line numberDiff line change
@@ -22,16 +22,24 @@ dir: rtl
2222

2323
## ملف schema.mjs
2424

25-
هذا هو الملف الذي ستعمل علية. يَحتوي على مُخططين ، أحدهما environment variables من جانب الخادم والآخر من جانب العميل ".
25+
هذا هو الملف الذي ستعمل علية. يَحتوي على مُخططين ، أحدهما environment variables من جانب الخادم والآخر من جانب العميل بالإضافة إلى Object الـ "clientEnv".
2626

2727
```ts:env/schema.mjs
2828
export const serverSchema = z.object({
2929
// DATABASE_URL: z.string().url(),
3030
});
3131

32+
export const serverEnv = {
33+
// DATABASE_URL: process.env.DATABASE_URL,
34+
};
35+
3236
export const clientSchema = z.object({
3337
// NEXT_PUBLIC_WS_KEY: z.string(),
3438
});
39+
40+
export const clientEnv = {
41+
// NEXT_PUBLIC_WS_KEY: process.env.NEXT_PUBLIC_WS_KEY,
42+
};
3543
```
3644

3745
### الـ Server Schema
@@ -43,6 +51,8 @@ export const clientSchema = z.object({
4351

4452
أنشئ الـ client-side environment variables هنا، حتى تجعلهم متاحيت للـ client أضف `NEXT_PUBLIC` قبل الاسم.
4553

54+
### الـ clientEnv Object
55+
4656
هُنا حيثُ تقوم بعمل Destruct لـ `process.env`
4757
تحتاج Zod الي Object لتكون قادرة على تصحيح المُدخلات وبسبب طريقة عمل Next.js فلن نستطيع فعل هذا تلقائيا لذلك يجب أن تتم هذة العملية يدويا، لا تقلق فـ Typescript تقوم بتحذيرك إذا ارتكبت خطاّ.
4858

@@ -99,6 +109,11 @@ export const serverSchema = z.object({
99109
// ...
100110
TWITTER_API_TOKEN: z.string(),
101111
});
112+
113+
export const serverEnv = {
114+
// ...
115+
TWITTER_API_TOKEN: process.env.TWITTER_API_TOKEN,
116+
};
102117
```
103118

104119
**ملحوطة:** النص الفارغ تتعامل معة zod علي أنه نص صحيح، إذا ما اردت ان تُغيّر هذا الاسلوب فإستخدم `z.string().min(1)`

Diff for: ‎www/src/pages/en/usage/env-variables.md

+21
Original file line numberDiff line numberDiff line change
@@ -28,9 +28,17 @@ export const serverSchema = z.object({
2828
// DATABASE_URL: z.string().url(),
2929
});
3030

31+
export const serverEnv = {
32+
// DATABASE_URL: process.env.DATABASE_URL,
33+
};
34+
3135
export const clientSchema = z.object({
3236
// NEXT_PUBLIC_WS_KEY: z.string(),
3337
});
38+
39+
export const clientEnv = {
40+
// NEXT_PUBLIC_WS_KEY: process.env.NEXT_PUBLIC_WS_KEY,
41+
};
3442
```
3543

3644
### Server Schema
@@ -45,6 +53,14 @@ Define your client-side environment variables schema here.
4553

4654
To expose them to the client you need to prefix them with `NEXT_PUBLIC`. Validation will fail if you don't to help you detect invalid configuration.
4755

56+
### clientEnv Object
57+
58+
Destruct the `process.env` here.
59+
60+
We need a JavaScript object that we can parse our Zod-schemas with and due to the way Next.js handles environment variables, you can't destruct `process.env` like a regular object, so we need to do it manually.
61+
62+
TypeScript will help you make sure that you have entered the keys in both `clientEnv` as well as `clientSchema`.
63+
4864
```ts
4965
// ❌ This doesn't work, we need to destruct it manually
5066
const schema = z.object({
@@ -104,6 +120,11 @@ export const serverSchema = z.object({
104120
// ...
105121
TWITTER_API_TOKEN: z.string(),
106122
});
123+
124+
export const serverEnv = {
125+
// ...
126+
TWITTER_API_TOKEN: process.env.TWITTER_API_TOKEN,
127+
};
107128
```
108129

109130
_**NOTE:** An empty string is still a string, so `z.string()` will accept an empty string as a valid value. If you want to make sure that the environment variable is not empty, you can use `z.string().min(1)`._

Diff for: ‎www/src/pages/fr/usage/env-variables.md

+22-1
Original file line numberDiff line numberDiff line change
@@ -22,16 +22,24 @@ _TLDR; Si vous désirez ajouter une nouvelle variable d’environnement, vous de
2222

2323
## schema.mjs
2424

25-
C'est le fichier que vous allez modifier. Il contient deux schémas, l'un est pour les variables d'environnement côté serveur et le second est pour le côté client connu.
25+
C'est le fichier que vous allez modifier. Il contient deux schémas, l'un est pour les variables d'environnement côté serveur et le second est pour le côté client connu sous l'objet `clientEnv`.
2626

2727
```ts:env/schema.mjs
2828
export const serverSchema = z.object({
2929
// DATABASE_URL: z.string().url(),
3030
});
3131

32+
export const serverEnv = {
33+
// DATABASE_URL: process.env.DATABASE_URL,
34+
};
35+
3236
export const clientSchema = z.object({
3337
// NEXT_PUBLIC_WS_KEY: z.string(),
3438
});
39+
40+
export const clientEnv = {
41+
// NEXT_PUBLIC_WS_KEY: process.env.NEXT_PUBLIC_WS_KEY,
42+
};
3543
```
3644

3745
### Schéma Serveur
@@ -46,6 +54,14 @@ Définissez votre schéma de variables d'environnement du côté client ici.
4654

4755
Pour les exposer au client, vous devez les préfixer avec `NEXT_PUBLIC`. La validation échouera si vous ne le faites pas, afin de vous aider à détecter une configuration non valide.
4856

57+
### Objet clientEnv
58+
59+
Déstructurez `process.env` ici.
60+
61+
Nous avons besoin d'un objet JavaScript avec lequel nous pouvons analyser nos schémas Zod et en raison de la façon dont Next.js gère les variables d'environnement, vous ne pouvez pas déstructurez `process.env` comme un objet régulier. Du coup nous devons le faire manuellement.
62+
63+
TypeScript vous aidera à vous assurer que vous avez entré les clés dans `clientEnv` ainsi que `clientSchema`.
64+
4965
```ts
5066
// ❌ Cela ne fonctionne pas, nous devons le déstructurer manuellement
5167
const schema = z.object({
@@ -105,6 +121,11 @@ export const serverSchema = z.object({
105121
// ...
106122
TWITTER_API_TOKEN: z.string(),
107123
});
124+
125+
export const serverEnv = {
126+
// ...
127+
TWITTER_API_TOKEN: process.env.TWITTER_API_TOKEN,
128+
};
108129
```
109130

110131
_**NOTE:** Une chaîne vide est toujours une chaîne, donc `z.string()` acceptera une chaîne vide comme valeur valide. Si vous voulez vous assurer que la variable d'environnement n'est pas vide, vous pouvez utiliser `z.string().min(1)`._

Diff for: ‎www/src/pages/no/usage/env-variables.md

+22-1
Original file line numberDiff line numberDiff line change
@@ -21,16 +21,24 @@ _TLDR; Hvis du vil legge til en ny miljøvariabel, må du definere den i både `
2121

2222
## schema.mjs
2323

24-
Endringene skjer i denne filen. Den inneholder to skjemaer, ett for servermiljøvariabler og ett for klientmiljøvariabler.
24+
Endringene skjer i denne filen. Den inneholder to skjemaer, ett for servermiljøvariabler og ett for klientmiljøvariabler, og et `clientEnv`-objekt.
2525

2626
```ts:env/schema.mjs
2727
export const serverSchema = z.object({
2828
// DATABASE_URL: z.string().url(),
2929
});
3030

31+
export const serverEnv = {
32+
// DATABASE_URL: process.env.DATABASE_URL,
33+
};
34+
3135
export const clientSchema = z.object({
3236
// NEXT_PUBLIC_WS_KEY: z.string(),
3337
});
38+
39+
export const clientEnv = {
40+
// NEXT_PUBLIC_WS_KEY: process.env.NEXT_PUBLIC_WS_KEY,
41+
};
3442
```
3543

3644
### Oppsett av Serverskjema
@@ -45,6 +53,14 @@ Definer ditt skjema for klientmiljøvariabeler her.
4553

4654
For å gjøre dem tilgjengelige for klienten, _må_ du prefiksere dem med `NEXT_PUBLIC`. Validering vil mislykkes hvis du ikke gjør det, for å hjelpe deg med å oppdage en ugyldig konfigurasjon.
4755

56+
### clientEnv-Objektet
57+
58+
I denne filen må vi få tilgang til verdiene fra `process.env`-objektet.
59+
60+
Vi trenger et JavaScript-objekt som vi kan analysere gjennom Zod-skjemaene og på grunn av måten Next.js håndterer miljøvariabler kan vi ikke destrukturere `process.env`-objektet som et normalt objekt. Derfor må vi gjøre det manuelt.
61+
62+
TypeScript vil hjelpe deg med å sørge for at du legger nøklene i både `clientEnv` og `clientSchema`.
63+
4864
```ts
4965
// ❌ Dette fungerer ikke. Vi må destrukturere den manuelt.
5066
const schema = z.object({
@@ -102,6 +118,11 @@ export const serverSchema = z.object({
102118
// ...
103119
TWITTER_API_TOKEN: z.string(),
104120
});
121+
122+
export const serverEnv = {
123+
// ...
124+
TWITTER_API_TOKEN: process.env.TWITTER_API_TOKEN,
125+
};
105126
```
106127

107128
_**MERK:** En tom streng er fortsatt en streng, så `z.string()` vil godta en tom streng som en gyldig verdi. Hvis du vil forsikre deg om at miljøvariabelen ikke er tom, kan du bruke `z.string().min(1)`._

0 commit comments

Comments
 (0)