Treating warnings as errors because process.env.CI = true

avatar
Borislav Hadzhiev

Last updated: Mar 7, 2024
3 min

banner

# Table of Contents

  1. Treating warnings as errors because process.env.CI = true
  2. Unsetting the CI environment variable on Netlify
  3. Unsetting the CI environment variable in Vercel

# Treating warnings as errors because process.env.CI = true

The error "Treating warnings as errors because process.env.CI = true" occurs because the CI environment variable has been set to true in your deployment environment.

When the variable is set to true, warnings are treated as build errors.

You can set the CI environment variable to false to resolve the issue.

Here is the complete error message.

shell
Treating warnings as errors because process.env.CI = true. Most CI servers set it automatically. Failed to compile.

To resolve the error, you have to unset the CI environment variable that has been set to true by default.

This can be done in multiple ways, for example, you could change your build command to the following.

shell
CI=false npm run build

The command should work for Netlify, Vercel, Gitlab CLI, etc.

However, you can also set the environment variable in your package.json file.

First, install the cross-env package to be able to set an environment variable in a way that works on all operating systems.

Open your terminal in your project's root directory (where your package.json) file is and run the following command.

shell
# 👇️ with NPM npm install cross-env # 👇️ with YARN yarn add cross-env

install cross env module

Open your package.json file and update your build script to set the CI environment variable to false before issuing the build command.

package.json
{ "scripts": { "start": "react-scripts start", "build": "cross-env CI=false react-scripts build", "test": "react-scripts test", "eject": "react-scripts eject" } }

Notice that the build script now sets CI to false before running the react-scripts build command.

If you don't want to use the cross-env package, you can also try setting the environment variable directly

package.json
{ "scripts": { "start": "react-scripts start", "build": "CI=false react-scripts build", "test": "react-scripts test", "eject": "react-scripts eject" } }

If you are on Windows and don't want to use the cross-env package, you have to use the set command.

package.json
{ "scripts": { "start": "react-scripts start", "build": "set \"CI=false\" && react-scripts build", "test": "react-scripts test", "eject": "react-scripts eject" } }

Notice that the double quotes are escaped with a backslash.

However, using the cross-env package is much cleaner because it works on all operating systems.

# Unsetting the CI environment variable on Netlify

For example, if you use Netlify:

  1. Log in to Netlify.
  2. Select your App and then click on "Site settings".
  3. Click on BUild & Deploy.
  4. Click on Continuous Deployment and then select Edit settings.
  5. Set your Build command to the following:
shell
CI=false npm run build

set ci false in build command

If you use yarn, you would use the following command instead.

shell
CI=false yarn build
  1. You can also scroll down to the Environment Variables section > Edit Variables and add a new environment variable that sets CI to false.
shell
CI = false

set ci environment variable to false netlify

  1. You have to rebuild your deployment after making the change.

Rebuilding your App will trigger the build command.

If you manage your configuration in a netlify.toml file, set the command property to the following.

netlify.toml
command = "CI=false npm run build"

Rebuild your deployment after making the change.

# Unsetting the CI environment variable in Vercel

The error also occurs when deploying to Vercel.

To resolve the issue, you have to add an environment variable with the name of CI and value set to false.

shell
CI = false

You can follow the official docs if you need an illustrated guide on how to add an environment variable in Vercel.

Setting the CI environment variable to false will override the System environment variable and warnings will no longer be treated as errors.

# Additional Resources

You can learn more about the related topics by checking out the following tutorials:

I wrote a book in which I share everything I know about how to become a better, more efficient programmer.
book cover
You can use the search field on my Home Page to filter through all of my articles.