Environment variables in Nuxt

Runtime config, the NUXT_ prefix and which values end up in the browser.

SNP 076 #614 Filed js nuxt

Declare the values and their defaults in nuxt.config.ts:

typescript
export default defineNuxtConfig({
  runtimeConfig: {
    apiSecret: '',
    public: {
      apiBase: '/api',
    },
  },
})

Then override them with environment variables at runtime, no rebuild needed. The name is NUXT_ plus the key in upper snake case, with PUBLIC_ for the public ones:

shell
NUXT_API_SECRET=abc123
NUXT_PUBLIC_API_BASE=https://api.example.com

Read them with useRuntimeConfig(). Everything under public is sent to the browser; everything else stays on the server. Only NUXT_* variables are picked up, a random API_KEY in .env does nothing.