create-react-app: Trying to develop with react-hooks (react@16.7.0-alpha) - Uncaught Error: Module build failed (from ./node_modules/react-scripts/node_modules/babel-loader/lib/index.js):

Is this a bug report?

Yes

Did you try recovering your dependencies?

1.10.1

Which terms did you search for in User Guide?

Uncaught Error: Module build failed (from ./node_modules/react-scripts/node_modules/babel-loader/lib/index.js):

Environment

npx: installed 63 in 11.394s

Environment Info: (node:1363) UnhandledPromiseRejectionWarning: TypeError: Cannot read property ‘1’ of null at a.run.then.e (/root/.npm/_npx/1363/lib/node_modules/create-react-app/node_modules/envinfo/dist/envinfo.js:1:97255) (node:1363) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 1) (node:1363) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.

Steps to Reproduce

(Write your steps here:)

1. run yarn
2. browse app
3. check console

Expected Behavior

App was running perfectly before with the same package.json setup and the same exact code, nothing has been changed, only ran a fresh modules installation and then everything broke, re-installing the node_modules was the only change that has been made, before that app was working, after that, app is not working.

Actual Behavior

I get the following error:

Uncaught Error: Module build failed (from ./node_modules/react-scripts/node_modules/babel-loader/lib/index.js):
Uncaught Error: Module build failed (from ./node_modules/react-scripts/node_modules/babel-loader/lib/index.js):
Error: ENOENT: no such file or directory, open '/src/node_modules/debug/src/debug.js'
    at Object../node_modules/debug/src/debug.js (browser.js:157)
    at __webpack_require__ (bootstrap:782)
    at fn (bootstrap:150)
    at Object.<anonymous> (browser.js:6)
    at Object../node_modules/debug/src/browser.js (browser.js:157)
    at __webpack_require__ (bootstrap:782)
    at fn (bootstrap:150)
    at Object../node_modules/sockjs-client/lib/utils/url.js (url.js:8)
    at __webpack_require__ (bootstrap:782)
    at fn (bootstrap:150)

this is my package.json file:

{
  "name": "wms-pickit",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@material-ui/icons": "^3.0.1",
    "classnames": "^2.2.6",
    "husky": "^1.2.0",
    "lint-staged": "^8.1.0",
    "lodash": "^4.17.11",
    "node-sass": "^4.10.0",
    "prettier": "^1.15.2",
    "react": "^16.7.0-alpha.2",
    "react-dom": "^16.7.0-alpha.2",
    "react-router-dom": "^4.3.1",
    "react-scripts": "2.1.1",
    "typeface-roboto": "0.0.54",
    "uuid": "^3.3.2",
    "serve": "^10.1.1"
  },
  "scripts": {
    "start": "PORT=8080 react-scripts start",
    "build": "react-scripts build",
    "serve": "serve -s -p 8080 build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": [
    ">0.2%",
    "not dead",
    "not ie <= 11",
    "not op_mini all"
  ],
  "devDependencies": {
    "@material-ui/core": "^3.5.1"
  },
  "husky": {
    "hooks": {
      "pre-commit": "lint-staged"
    }
  },
  "lint-staged": {
   "src/**/*.{js,jsx,ts,tsx,json,css,scss,md}": [
     "prettier --single-quote --write",
     "git add"
   ]
 }
}

I created a test app to help with debugging, here’s the repo: https://github.com/therayess/CRA_DEBUG