[Dúvida] Como usar variaveis de ambiente no nextjs

A variavel de ambiente nao tem valor (undefined) mas esta sendo definida

no .env

NEXT_PUBLIC_API_ZABBIX=url-api

ja tenteni assim tbm

NEXT_PUBLIC_API_ZABBIX="url-api"

E é assim que estou chamando (em componentes .tsx), coloquei verificadores e mesmo assim da undefidend. O que estou fazendo de errado?

 const apiURL = process.env.NEXT_PUBLIC_API_ZABBIX
    console.log("NEXT_PUBLIC_API_ZABBIX: ", apiURL)
    console.log("NEXTAUTH_URL: ", process.env.NEXTAUTH_URL)

    if (!process.env.NEXT_PUBLIC_API_ZABBIX) {
      console.error("Sem endpoit")
    } else {
      console.log("Passou")
    }

    try {
      const response = await fetch(process.env.NEXT_PUBLIC_API_ZABBIX, {
        method: "POST",
        headers: {
          "Content-Type": "application/json",
        },
        body: JSON.stringify(formattedData),
      });

      if (response.ok) {
        const data: ApiZabbixResponseProps = await response.json();
        setApiResponseData(data);
        console.log("dados da api:", data);
      } else {
        console.error("Erro ao fazer a solicitação de postagem");
      }