5

I'm trying to gitlab's CI/CD and was making a yml-file that build the project. The problem is that I get the following:

$ npm run build
 > myreactapp@0.1.0 build C:\GitLab-Runner\builds\QLuLhspz\0\I416547\s4-software-fun-frontend
 > react-scripts build
 Creating an optimized production build...
 Treating warnings as errors because process.env.CI = true.
 Most CI servers set it automatically.
 Failed to compile.
 ./src/Components/Task/TaskList.js
   Line 120:15:  'currentTasks' is assigned a value but never used                                 no-unused-vars
   Line 175:25:  Headings must have content and the content must be accessible by a screen reader  jsx-a11y/heading-has-content
 ./src/Components/House/House.js
   Line 150:16:  'Address' is assigned a value but never used      no-unused-vars
   Line 150:25:  'HouseNumber' is assigned a value but never used  no-unused-vars
   Line 150:38:  'City' is assigned a value but never used         no-unused-vars
 ./src/Components/House/HouseList.js
   Line 160:25:  Headings must have content and the content must be accessible by a screen reader  jsx-a11y/heading-has-content
 ./src/Components/Person/PersonList.js
   Line 183:25:  Headings must have content and the content must be accessible by a screen reader  jsx-a11y/heading-has-content
 ./src/Components/Footer.js
   Line 2:28:  'Row' is defined but never used  no-unused-vars
 ./src/Components/Person/Person.js
   Line 4:9:     'Link' is defined but never used                  no-unused-vars
   Line 166:16:  'FullName' is assigned a value but never used     no-unused-vars
   Line 166:26:  'PhoneNumber' is assigned a value but never used  no-unused-vars
 npm ERR! code ELIFECYCLE
 npm ERR! errno 1
 npm ERR! myreactapp@0.1.0 build: `react-scripts build`
 npm ERR! Exit status 1
 npm ERR! 
 npm ERR! Failed at the myreactapp@0.1.0 build script.
 npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
 npm ERR! A complete log of this run can be found in:
 npm ERR!     C:\WINDOWS\system32\config\systemprofile\AppData\Roaming\npm-cache\_logs\2020-05-17T11_42_43_915Z-debug.log
Uploading artifacts for failed job
00:00
 ERROR: Job failed: exit status 1

Now it says warnings are set to errors so what I tried doing in my yml-file was adding CI=false:

stages: ["build", "test", "deploy"]

before_script:
    - npm install
    - CI=false

build:
    stage: build
    script: npm run build

test:
    stage: test
    script: npm run test

deploy:
    stage: deploy
    script: npm run start

But than it says the command is not recognized. Is it because it's not a powershell command or does react.js use the node-command? (either way it doesn't work)

Sources tried:

EDIT: found the problem....instead of doing it in the yml-file it should've been done in the project itself. How to set environment variable in React JS..?

zhrgci
  • 584
  • 1
  • 6
  • 25

5 Answers5

4

For anyone having this issue because they're running script using powershell:

$env:CI=$false; npm run build;

$env:CI is how you set the environment variable inline in powershell.

Dinh Tran
  • 535
  • 4
  • 13
4

Another way to disable CI using windows is adding build-win script to package.json:

  "scripts": {
    "build": "CI=false rescripts build",
    "build-win": "set CI=false&&rescripts build"
  }

And then running npm run build-win. Note that && must not be surrounded by spaces.

alaster
  • 3,821
  • 3
  • 24
  • 32
2

You'll need to set the environment variable along with running each relevant command: CI=false npm run build and CI=false npm run build.

If setting it as a before_script, GitLab CI tries to run it as a stand-alone command (when actually it's just setting an environment variable).

Is it because it's not a powershell command or does react.js use the node-command?

Powershell is Windows-only, whereas GitLab CI commands are bash commands that run on Linux. React isn't related to Node.js, though create-react-app does use it. Environment variables that are set can be read by any code, regardless if it's Node.js or anything else.

Lionel Rowe
  • 5,164
  • 1
  • 14
  • 27
0

CI=true is needed in case you would like to process test during the deployment but it can be easily archived by setting a flag via package.json

 "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "CI=true react-scripts test"
  }
dawid debinski
  • 392
  • 4
  • 6
0

When I wanted to create a build folder using npm run build command, this problem showed up. After trying the above answers (CI= false or CI= true in the script object of the package.json I still get the same error.

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

Edit (31.10.2021): I found the solution that remove the bothersome problem in another post. This is the related post: npm ERR! reminder@0.1.0 build: `CI= react-scripts build` Thank you @manchit197

Ozer Ozturk
  • 149
  • 1
  • 6