N
Nuxt•3d ago
Adnan Erlansyah

NODE_ENV isn't changed although it's already updated in the environment

How can I fix the NODE_ENV value, which is still set to "development" even though I've changed it to "local" in Nuxt.js 3? I've set the public configuration in my nuxt.config.ts, but the NODE_ENV value hasn't changed, even though the environment has already been updated. 
  runtimeConfig: {
    appSecret: process.env.APP_KEY,
    public: {
      nodeEnv: process.env.NODE_ENV,
      baseURL: process.env.BASE_URL,
      servicesAPI: process.env.SERVICES_API ?? '',
      vueAppMode: process.env.VUE_APP_MODE,
    },
  },
  runtimeConfig: {
    appSecret: process.env.APP_KEY,
    public: {
      nodeEnv: process.env.NODE_ENV,
      baseURL: process.env.BASE_URL,
      servicesAPI: process.env.SERVICES_API ?? '',
      vueAppMode: process.env.VUE_APP_MODE,
    },
  },
4 Replies
kapa.ai
kapa.ai•3d ago
Hi @Adnan Erlansyah. 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 provided, I can explain why the NODE_ENV value isn't changing as expected in your Nuxt 3 application and suggest a solution. The issue you're experiencing is related to how Nuxt handles environment variables and the NODE_ENV setting. According to the Nuxt documentation on environment overrides, Nuxt influences the NODE_ENV setting in specific ways. Here are the key points to understand: 1. Nuxt sets process.env.NODE_ENV to "production" when building the application, and to "development" when running the dev server. This behavior is built into Nuxt and overrides any NODE_ENV value you set manually. 2. To use a custom environment name, you should use the --envName flag when running Nuxt CLI commands, rather than trying to change NODE_ENV directly. To fix your issue and use a custom environment name like "local", you can do the following: 1. In your nuxt.config.ts, use the $env key to specify configuration for different environments: 
export default defineNuxtConfig({
  $env: {
    local: {
      // Your local environment configuration
    }
  },
  // ... rest of your configuration
})
export default defineNuxtConfig({
  $env: {
    local: {
      // Your local environment configuration
    }
  },
  // ... rest of your configuration
})
2. When running your Nuxt application, use the --envName flag to specify the environment: 
npx nuxi dev --envName local
npx nuxi dev --envName local
This approach allows you to have environment-specific configurations without relying on NODEENV. For runtime configuration that you want to access in your application, continue using the runtimeConfig as you've shown in your example. These values can be overridden using environment variables prefixed with `NUXT. [Nuxt Configuration](<https://nuxt.com/docs/getting-started/configuration#nuxt-configuration>) explains that you can use environment variables to override runtimeConfig values. For example: ``` NUXT_PUBLIC_BASE_URL=/foo/ nuxi dev ``` This would override the baseURL in your public runtime config. Remember that in production, you'll need to set these environment variables on your server or deployment platform, as the .env` file is not used in production environments. Environment Variables and Private Tokens provides more details on how to handle environment variables in Nuxt 3. By following these guidelines, you should be able to achieve the environment-specific behavior you're looking for in your Nuxt 3 application. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
kapa.ai
kapa.ai•3d ago
<@1079709612078534676> Kapa.ai is still learning and improving, please let me know how I did by reacting below.
Adnan Erlansyah
Adnan ErlansyahOP•2d ago
I used the another way by creating special env variable for app mode. I haven't still tried this yet. But I just want the changes is to be implemented in the npm run dev too
Mittchel
Mittchel•21h ago
May be something like creating .env.local, .env.development, .env.production files in the root of your project and 
import { defineNuxtConfig } from 'nuxt/config'
import dotenv from 'dotenv'

dotenv.config({ path: `.env.${process.env.NODE_ENV || 'development'}` })

export default defineNuxtConfig({
  runtimeConfig: {
    appSecret: process.env.APP_KEY,
    public: {
      nodeEnv: process.env.NODE_ENV, 
      baseURL: process.env.BASE_URL,
      servicesAPI: process.env.SERVICES_API ?? '',
      vueAppMode: process.env.VUE_APP_MODE,
    },
  },
})
import { defineNuxtConfig } from 'nuxt/config'
import dotenv from 'dotenv'

dotenv.config({ path: `.env.${process.env.NODE_ENV || 'development'}` })

export default defineNuxtConfig({
  runtimeConfig: {
    appSecret: process.env.APP_KEY,
    public: {
      nodeEnv: process.env.NODE_ENV, 
      baseURL: process.env.BASE_URL,
      servicesAPI: process.env.SERVICES_API ?? '',
      vueAppMode: process.env.VUE_APP_MODE,
    },
  },
})
Or 
set NODE_ENV=local & npm run dev 
set NODE_ENV=local & npm run build 
set NODE_ENV=local & npm run dev 
set NODE_ENV=local & npm run build

Did you find this page helpful?