Can't modify the NODE_ENV of a branch

Help
1

Hi,

I have a project that uses NODE_ENV variables. In my development environment (localhost), it’s correctly set to “development,” and on the main branch (deployed website), it’s automatically set to “production” as expected.

The issue arises with a custom branch I created, named “dev,” which is meant to serve as a test branch using a “development” environment. However, Vercel treats it as a preview branch, assigning it the “production” NODE_ENV value. I’ve tried changing both the NODE_ENV and VERCEL_ENV variables, but the environment still defaults to “production.”

This is problematic because this custom branch is not intended to use the same environment settings as production. I don’t want it to:

  • Send data reports to the same endpoints as my production environment.
  • Use the same production database; instead, I would prefer to use a replica for testing purposes.
  • Prevent logging in the browser for the deployed website, but allow it for staging and development.

Ultimately, I need the ability to set the NODE_ENV to “development” or “test” for this custom branch instead of “production.” Could you guide me on how to achieve this with Vercel?

Thanks in advance

2

Hi, @franckdsf! Welcome to the Vercel Community.

Vercel automatically sets NODE_ENV to “production” for all deployments, including preview deployments, to ensure optimal performance . This is why changing NODE_ENV directly doesn’t work as expected.

You can work around this by using a custom environment variable like NEXT_PUBLIC_APP_ENV or CUSTOM_NODE_ENV instead of relying solely on NODE_ENV.

Vercel allows you to set environment variables for specific branches.

Now, you can use your custom environment variable to determine the environment. For example:

const isProduction = process.env.NEXT_PUBLIC_APP_ENV === 'production';
const isDevelopment = process.env.NEXT_PUBLIC_APP_ENV === 'development';
const isTest = process.env.NEXT_PUBLIC_APP_ENV === 'test';

Then you can configure your application logic and use these custom environment checks to control your application’s behavior:

if (isDevelopment || isTest) {
  // Use test database
  // Enable logging
  // Use test endpoints for data reports
} else if (isProduction) {
  // Use production database
  // Disable logging
  // Use production endpoints for data reports
}

Or if you need to use environment variables that shouldn’t be exposed to the client, you can create a server-side environment configuration. Create a file like env.js in your project:

const env = {
  NODE_ENV: process.env.NODE_ENV,
  APP_ENV: process.env.CUSTOM_NODE_ENV || process.env.NODE_ENV,
  // Add other environment variables as needed
};

module.exports = env;

Then use this in your server-side code:

const env = require('./env');

if (env.APP_ENV === 'development' || env.APP_ENV === 'test') {
  // Development or test-specific logic
} else {
  // Production logic
}

After redeploying your project after setting up these environment variables the changes should take effect.

Let us know how you get on!

3

Hi,
I am indeed using a custom env.js file, and I ended up creating a NEXT_PUBLIC_CUSTOM_NODE_ENV that I’m using like this:

const env = {
...,
  NODE_ENV: process.env.NEXT_PUBLIC_CUSTOM_NODE_ENV ?? process.env.NODE_ENV,
  NEXT_PUBLIC_NODE_ENV: process.env.NEXT_PUBLIC_CUSTOM_NODE_ENV ?? process.env.NODE_ENV,
};

Thanks for the help :slight_smile:

1 Like
4

Thanks for coming back with your solution!

5

This topic was automatically closed 2 days after the last reply. New replies are no longer allowed.