Jump to content

Vari√°veis de Ambiente

O Create T3 App usa sua mais nova biblioteca @t3-oss/env-nextjs↗ e zod↗ para validar variáveis de ambiente durante o tempo de execução (runtime) e buildtime fornecendo uma lógica simples no arquivo src/env.mjs:

env.mjs

Muito longo, não li; Se você quiser adicionar uma nova variável de ambiente, você deve adicioná-la ao seu .env ao definir no validador em src/env.mjs.

Este arquivo é dividido em duas partes - o esquema e a desestruturação do objeto, bem como a lógica de validação. A lógica de validação não deve ser tocada.

env.mjs
import { createEnv } from "@t3-oss/env-nextjs";
import { z } from "zod";
 
export const env = createEnv({
  server: {
    NODE_ENV: z.enum(["development", "test", "production"]),
  },
  client: {
    // NEXT_PUBLIC_CLIENTVAR: z.string(),
  },
  runtimeEnv: {
    NODE_ENV: process.env.NODE_ENV,
  },
});

T3 Env traz um novo conceito através do createEnv, o qual é responsável por criar o esquema e irá incluir a lógica de validação para variáveis de ambiente no cliente e servidor.

‚ĄĻÔłŹ

Para mais informa√ß√Ķes sobre como o createEnv funciona internamente, confira a documenta√ß√£o de T3 Env‚Üó

Usando Vari√°veis de Ambiente

Quando você quiser usar suas variáveis de ambiente, você pode importá-las de env.mjs e usá-las como faria normalmente. Se você importar isso no cliente e tentar acessar uma variável de ambiente do lado do servidor, receberá um erro em tempo de execução (runtime).

pages/api/hello.ts
import { env } from "../../env.mjs";

// `env` é totalmente tipado e fornece preenchimento automático 
const dbUrl = env.DATABASE_URL;
pages/index.tsx
import { env } from "../env.mjs";

// ‚ĚĆ Isso lan√ßar√° um erro em tempo de execu√ß√£o
const dbUrl = env.DATABASE_URL;

// ‚úÖ Isso est√° correto
const wsKey = env.NEXT_PUBLIC_WS_KEY;

.env.example

Como o arquivo .env padrão não está comprometido com o controle de versão, também incluímos um arquivo .env.example, no qual você pode, opcionalmente, manter uma cópia de seu arquivo .env com quaisquer segredos removidos. Isso não é necessário, mas recomendamos manter o exemplo atualizado para tornar mais fácil para os contribuidores começarem a usar seu ambiente.

Alguns frameworks e outras ferramentas, como o Next.js, sugerem que você armazene variáveis em um arquivo .env.local e faça commit de arquivos .env em seu projeto. Isso não é recomendado, pois poderia facilitar o acidente de incluir variáveis ambiente secretas em seu histórico do git. Em vez disso, recomendamos que você armazene essas variáveis no arquivo .env, mantenha o arquivo .env em seu .gitignore e faça commit somente de arquivos .env.example em seu projeto.

Adicionando Vari√°veis Ambiente

Para garantir que sua compilação nunca seja concluída sem as variáveis de ambiente de que o projeto precisa, você precisará adicionar novas variáveis de ambiente em dois locais:

ūüďĄ .env: Insira sua vari√°vel de ambiente como faria normalmente em um arquivo .env, ou seja, CHAVE=VALOR. Al√©m disso, certifique-se de desestruturar elas na op√ß√£o runtimeEnv, por exemplo, CHAVE: process.env.CHAVE.

ūüďĄ env.mjs: Adicione a l√≥gica de valida√ß√£o apropriada para as vari√°veis de ambiente definindo um esquema Zod, por exemplo NOME_DA_VARIAVEL: z.string()

Opcionalmente, você também pode manter .env.example atualizado:

ūüďĄ .env.example: Insira sua vari√°vel de ambiente, mas certifique-se de n√£o incluir o valor se for secreto, ou seja, CHAVE=VALOR ou CHAVE=

Exemplo

Quero adicionar meu token da API do Twitter como uma vari√°vel de ambiente do lado do servidor

  1. Adicione a vari√°vel de ambiente a .env:
TWITTER_API_TOKEN=1234567890
  1. Adicione a vari√°vel de ambiente a env.mjs:
import { createEnv } from "@t3-oss/env-nextjs";
import { z } from "zod";
 
export const env = createEnv({
  server: {
    TWITTER_API_TOKEN: z.string(),
  },
  // ...
});
‚ĄĻÔłŹ

Uma string vazia ainda é uma string, então z.string() aceitará uma string vazia como um valor válido. Se você quiser ter certeza de que a variável de ambiente não está vazia, você pode usar z.string().min(1).

  1. opcional: adicione a vari√°vel de ambiente a .env.example, mas n√£o inclua o token
export const env = createEnv({
  // ...
  runtimeEnv: {
    TWITTER_API_TOKEN: process.env.TWITTER_API_TOKEN,
  },
});

Recent Contributors To This Page