Nuxt•2w ago

Configuring nitro storage with environment variables

I would like to move the configuration of a GitHub-backed nitro storage to environment variables. Do I simply use process.env in nuxt.config or is there a better way?

5 Replies

kapa.ai•2w ago

Hi @tpluscode. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- Yes, you can use environment variables in your nitro storage configuration within nuxt.config by referencing them via process.env. This approach is demonstrated in several knowledge sources, where environment variables are accessed in nuxt.config.ts for configuring storage drivers (such as Redis) and other runtime options. For example:

export default defineNuxtConfig({
  nitro: {
    storage: {
      github: {
        driver: 'github',
        token: process.env.GITHUB_TOKEN,
        repo: process.env.GITHUB_REPO,
        branch: process.env.GITHUB_BRANCH
      }
    }
  }
})

export default defineNuxtConfig({
  nitro: {
    storage: {
      github: {
        driver: 'github',
        token: process.env.GITHUB_TOKEN,
        repo: process.env.GITHUB_REPO,
        branch: process.env.GITHUB_BRANCH
      }
    }
  }
})

This pattern is supported and works both in development and production, as long as the environment variables are properly set in your environment or .env file. Nuxt will load variables from .env automatically at dev, build, and generate time if the file is at the project root. If you are deploying in environments like Docker or Azure, ensure the environment variables are set in your deployment configuration as well. If you encounter issues with variables not being picked up, you can explicitly load dotenv in your nuxt.config, but for most cases, Nuxt's built-in dotenv support is sufficient [nuxt.config.ts won't read env variables], [Nuxt 3 app deployed to Azure. Environment variables are ignored in nitro section of nuxt.config.ts]. So, using process.env in nuxt.config is the standard and recommended way to move your nitro storage configuration to environment variables. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------

kapa.ai•2w ago

<@555413648382623754> Kapa.ai is still learning and improving, please let me know how I did by reacting below.

tpluscodeOP•2w ago

what about the "runtime config" feature? @kapa.ai

kapa.ai•2w ago

Let me check the knowledge base for you again. One moment! :books: ---------------------- Nuxt's runtimeConfig feature is designed to provide a secure and flexible way to manage configuration values that may differ between environments (development, production, etc.). It allows you to define both public and private configuration values in your nuxt.config file, which can then be accessed at runtime using the useRuntimeConfig composable. - Public values (under the public key) are exposed to both the server and client. - Private values (outside the public key) are only available on the server side. You can set runtimeConfig values using environment variables, for example:

export default defineNuxtConfig({
  runtimeConfig: {
    githubToken: process.env.GITHUB_TOKEN, // private
    public: {
      githubRepo: process.env.NUXT_PUBLIC_GITHUB_REPO, // public
      githubBranch: process.env.NUXT_PUBLIC_GITHUB_BRANCH
    }
  }
})

export default defineNuxtConfig({
  runtimeConfig: {
    githubToken: process.env.GITHUB_TOKEN, // private
    public: {
      githubRepo: process.env.NUXT_PUBLIC_GITHUB_REPO, // public
      githubBranch: process.env.NUXT_PUBLIC_GITHUB_BRANCH
    }
  }
})

At runtime, you can access these values in your app using:

const config = useRuntimeConfig()
const repo = config.public.githubRepo

const config = useRuntimeConfig()
const repo = config.public.githubRepo

Should you use runtimeConfig for Nitro storage?
While runtimeConfig is ideal for values you need to access at runtime (especially if you want to keep some values private), for configuring Nitro storage in nuxt.config, you typically use process.env directly. However, you can reference runtimeConfig values in your server code or API routes if you want to centralize configuration and make it easier to override per environment [Is Nuxt 3's runtimeConfig UNSAFE?!]. Summary:
- Use process.env in nuxt.config for build-time configuration (like Nitro storage). - Use runtimeConfig for values you want to access at runtime, especially if you need to distinguish between public and private values or want to access them in your app code [Is Nuxt 3's runtimeConfig UNSAFE?!]. If you need to pass runtimeConfig values into Nitro storage at runtime, you would need to do so in your server code, not directly in nuxt.config. The knowledge sources do not explicitly mention using runtimeConfig directly inside the nitro.storage section of nuxt.config. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------

kapa.ai•2w ago

<@555413648382623754> Kapa.ai is still learning and improving, please let me know how I did by reacting below.

Gaming

Programming

Configuring nitro storage with environment variables

Did you find this page helpful?