N
Nuxt•4w ago
mpgalaxy

nuxt-auth-utils not finding env variables

Hi, I'm trying to get nuxt-auth-utils running with nuxt 4.2.0 and nuxt-auth-utils 0.5.25 using keycloak as oauth provider. I provided the NUXT_OAUTH_KEYCLOAK_CLIENT_ID, NUXT_OAUTH_KEYCLOAK_SERVER_URL and NUXT_OAUTH_KEYCLOAK_REALMvariables in my .env file, also set runtimeConfig with 
oauth: {
        keycloak: {
          clientId: "myclient",
          realm: "myrealm",
          serverUrl: "http://localhost:8080",
        },
      },
oauth: {
        keycloak: {
          clientId: "myclient",
          realm: "myrealm",
          serverUrl: "http://localhost:8080",
        },
      },
but the module always complains not having these env variables: 
Missing NUXT_OAUTH_KEYCLOAK_CLIENT_ID or NUXT_OAUTH_KEYCLOAK_CLIENT_SECRET or NUXT_OAUTH_KEYCLOAK_SERVER_URL or NUXT_OAUTH_KEYCLOAK_REALM env variables.
Missing NUXT_OAUTH_KEYCLOAK_CLIENT_ID or NUXT_OAUTH_KEYCLOAK_CLIENT_SECRET or NUXT_OAUTH_KEYCLOAK_SERVER_URL or NUXT_OAUTH_KEYCLOAK_REALM env variables.
This is in dev mode. How can I get this working ?
2 Replies
kapa.ai
kapa.ai•4w ago
Hi @mpgalaxy. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- Based on the knowledge sources, there are a few potential issues with environment variables in Nuxt that might be causing your problem: Potential Solutions 1. Check .env File Format and Location Ensure your .env file is at the root of your project and follows the standard format <KEY>=<VALUE>. According to the knowledge sources, Nuxt CLI has built-in dotenv support and should automatically load the .env file during development. 2. Use process.env in runtimeConfig The knowledge sources indicate that you should use process.env to access environment variables within nuxt.config.ts. Try updating your configuration like this: 
runtimeConfig: {
  oauth: {
    keycloak: {
      clientId: process.env.NUXT_OAUTH_KEYCLOAK_CLIENT_ID,
      realm: process.env.NUXT_OAUTH_KEYCLOAK_REALM,
      serverUrl: process.env.NUXT_OAUTH_KEYCLOAK_SERVER_URL,
    },
  },
}
runtimeConfig: {
  oauth: {
    keycloak: {
      clientId: process.env.NUXT_OAUTH_KEYCLOAK_CLIENT_ID,
      realm: process.env.NUXT_OAUTH_KEYCLOAK_REALM,
      serverUrl: process.env.NUXT_OAUTH_KEYCLOAK_SERVER_URL,
    },
  },
}
As shown in this Stack Overflow answer, using process.env ensures that environment variables are retrieved from the .env file instead of being hardcoded. 3. Known Issue with Nuxt 4.1.3+ and .env Files There's a documented issue where Nuxt 4.1.3 introduced problems with environment variables. Users reported that the error disappeared when temporarily deleting the .env file, and the issue was related to @nuxt/cli. This was resolved in @nuxt/cli v3.29.1. Since you're using Nuxt 4.2.0, ensure you have the latest version of @nuxt/cli by refreshing your lockfile or installing it explicitly. 4. Hard Reload After .env Changes According to the knowledge sources, .env variables are not automatically reloaded when they change. Try stopping your dev server completely and restarting it after making changes to your .env file. If these solutions don't resolve your issue, the problem might be specific to how nuxt-auth-utils reads environment variables, which isn't covered in the provided knowledge sources. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
kapa.ai
kapa.ai•4w ago
<@1213185024858267671> Kapa.ai is still learning and improving, please let me know how I did by reacting below.

Did you find this page helpful?