create-react-app: TypeError: Cannot read property 'forEach' of undefined if object destructing with rest props is used

Describe the bug

Compilation fails with TypeError: Cannot read property 'forEach' of undefined if object destructing with rest props is used in npx created app. Works with yarn though.

Versions of react-scripts affected: 3.1.0, 3.1.1 (with different error messages), 3.1.2 Most recent react-scripts version that works: 3.0.1

Did you try recovering your dependencies?

npm --version: 6.11.3

Which terms did you search for in User Guide?

TypeError: Cannot read property ‘forEach’ of undefined

Environment

$ npx create-react-app --info

Environment Info:

  System:
    OS: macOS 10.14
    CPU: (8) x64 Intel(R) Core(TM) i7-3615QM CPU @ 2.30GHz
  Binaries:
    Node: 12.11.0 - ~/.nvm/versions/node/v12.11.0/bin/node
    Yarn: Not Found
    npm: 6.11.3 - ~/.nvm/versions/node/v12.11.0/bin/npm
  Browsers:
    Chrome: 77.0.3865.90
    Firefox: 67.0
    Safari: 12.0
  npmPackages:
    react: ^16.10.1 => 16.10.1 
    react-dom: ^16.10.1 => 16.10.1 
    react-scripts: 3.1.2 => 3.1.2 
  npmGlobalPackages:
    create-react-app: Not Found

(paste the output of the command here.)

Steps to reproduce

(Write your steps here:)

Create new app using npx: $ npx create-react-app error-test. Make sure yarn is not installed.
Go to error-test/src/App.js and add following code to the end of the file:

const testCase = {
  restObjectPropsFails: ({ id, ...item }) => {
    return null;
  }
}

Run $ npm start from error-test directory

Expected behavior

Application is compiled correctly

Actual behavior

Compilation failed with message:

Failed to compile.

./src/App.js
TypeError: Cannot read property 'forEach' of undefined

Reproducible demo

(Paste the link to an example project and exact instructions to reproduce the issue.)

About this issue

Original URL
State: closed
Created 5 years ago
Reactions: 71
Comments: 41 (3 by maintainers)

Commits related to this issue

Add fixes for react-scripts 3.1.0 issues See https://github.com/facebook/create-react-app/issues/7753 for more info — committed to rustyb/tasking-manager by rustyb 5 years ago
minor style changes upgrade react dependencies - except react-scripts which currently has an issue with eslint https://github.com/facebook/create-react-app/issues/7753 — committed to rjwats/esp8266-react by rjwats 5 years ago
Fix react-scripts build error ./src/components/PageWrapper.js TypeError: Cannot read property 'forEach' of undefined was being thrown during build. According to a github issue downgrading is the sol... — committed to studioromeo/hacktoberfest-checker by studioromeo 5 years ago
Minor fixes to 2019 update (#359) * Fix react-scripts build error ./src/components/PageWrapper.js TypeError: Cannot read property 'forEach' of undefined was being thrown during build. Accordin... — committed to jenkoian/hacktoberfest-checker by studioromeo 5 years ago
2019 upgrade (#360) * Update for 2019 * Add grace period support. This year there is a 1 week grace period before a PR counts, this commit adds support for this by displaying 'pending' next to... — committed to jenkoian/hacktoberfest-checker by jenkoian 5 years ago

Most upvoted comments

Downgrading React Scripts to 3.0.1 worked for me.

+28

iMerica on Sep 30, 2019

The issue is definitely eslint-loader. Thanks @alexandrtovmach

Until that merge gets included, adding the following to package.json worked for me

"resolutions": {
    "eslint-loader": "3.0.2"
  }

+11

chrisbull on Sep 30, 2019

locking eslint at 6.4.0 in devDependencies fixes this on my end (at least until the pr referecned above is released). 6.5.0 fails

mattcosta7 on Sep 30, 2019

I had the same problem but found that reverting eslint to 6.4.0 from the simultaneous update to 6.5.0 solved the problem. Tried to npm i eslint@6.5.0 again and got same compile error. So working with: “eslint”: “^6.4.0”, “react”: “^16.10.1”, “react-dom”: “^16.10.1”, “react-router-dom”: “^5.1.1”, “react-scripts”: “^3.1.2”,

oyof8376 on Sep 30, 2019

gurpreetsingh2410 on Sep 30, 2019

This PR #7754 should fix this error

alexandrtovmach on Sep 30, 2019

3.1.1 is working fine for me while 3.1.2 doesn’t.

amayatsky on Sep 30, 2019

Yes, it is a bug with eslint-loader, but it is a design flaw in CRA to give a linter enough importance that it can break core development functionality.

iMerica on Sep 30, 2019

Ugh. Everything was working on Friday, then I upgraded to react 16.10.1 this morning, and was able to work on the dev server just fine for a few hours. Then I tried to do a build of my project, where I first deleted and re-installed all my dependencies, then did the standard npm run build. At that point, I started getting these kinds of errors: TypeError: Cannot read property 'forEach' of undefined

So I reverted back to my package.json file from this past Friday (react 16.9.0, react-script 3.1.2), blew away my node_modules folder, reinstalled all my dependencies, and I’m still getting the same error. Yuck!

FWIW, I don’t explicitly have eslint as one of my dependencies. I’m not sure what to make of that, but I’m dead in the water at the moment.

bmueller-sykes on Sep 30, 2019

yarn works because the lock file after rm -r node_modules yarn.lock; yarn install, the error can be reproduced.

knilink on Sep 30, 2019

npm i react-scripts@3.0.1

Downgrade to 3.0.1

Gr8z on Sep 30, 2019

Ran into the same issue and spent half a day debugging. Saw this issue and switched to a prior version and it seems to work like a charm.

smogili1 on Sep 29, 2019