1

I am new to react, I am setting up a new react-app that uses jest for UnitTesting, I have installed it and have now created the react app. It usually just launches the app to my browser on localhost, however, I am now getting this error:

Debugger attached.
Debugger attached.

There might be a problem with the project dependency tree.
It is likely not a bug in Create React App, but something you need to fix locally.

The react-scripts package provided by Create React App requires a dependency:

  "jest": "26.6.0"

Don't try to install it manually: your package manager does it automatically.
However, a different version of jest was detected higher up in the tree:

  C:\Users\tomas\OneDrive\Área de Trabalho\Gifermo2-react\gifermo2\node_modules\jest (version: 26.6.3)

I have tried to reinstall node_modules and reinstall jest. I have also run npm ls jest which gives the following output.

gifermo2@0.1.0 C:\Users\tomas\OneDrive\Área de Trabalho\Gifermo2-react\gifermo2
├── jest@26.6.3
└─┬ react-scripts@4.0.2
  ├─┬ jest-watch-typeahead@0.6.1
  │ └── jest@26.6.3 deduped
  └── jest@26.6.0

I also get these steps to follow, which I have but nothing seems to work.

To fix the dependency tree, try following the steps below in the exact order:

  1. Delete package-lock.json (not package.json!) and/or yarn.lock in your project folder.
  2. Delete node_modules in your project folder.
  3. Remove "jest" from dependencies and/or devDependencies in the package.json file in your project folder.
  4. Run npm install or yarn, depending on the package manager you use.

In most cases, this should be enough to fix the problem.
If this has not helped, there are a few other things you can try:

  5. If you used npm, install yarn (http://yarnpkg.com/) and repeat the above steps with it instead.
     This may help because npm has known issues with package hoisting which may get resolved in future versions.

  6. Check if C:\Users\tomas\OneDrive\Área de Trabalho\Gifermo2-react\gifermo2\node_modules\jest is outside your project directory.
     For example, you might have accidentally installed something in your home folder.

  7. Try running npm ls jest in your project folder.
     This will tell you which other package (apart from the expected react-scripts) installed jest.

If nothing else helps, add SKIP_PREFLIGHT_CHECK=true to an .env file in your project.

P.S. We know this message is long but please read the steps above :-) We hope you find them helpful!

Waiting for the debugger to disconnect...
Waiting for the debugger to disconnect...
npm ERR! code 1
npm ERR! path C:\Users\tomas\OneDrive\Área de Trabalho\Gifermo2-react\gifermo2
npm ERR! command failed
npm ERR! command C:\Windows\system32\cmd.exe /d /s /c react-scripts start

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\tomas\AppData\Local\npm-cache\_logs\2021-02-15T23_40_56_648Z-debug.log
Waiting for the debugger to disconnect...

I have googled everything but can't seem to find an answer, I am guessing that there is some conflict and I am using two different JEST versions, but on my package.json, I don't even have the jest dependecy. Any ideas?

Tomas Mota
  • 672
  • 5
  • 27
  • 2
    Check the `dependencies` and `devDependencies` in `package.json` at the root of your project. Is `jest` listed? If so, remove it and `npm install` again, possibly also following those steps you've already listed. `react-scripts` already installs `jest` for you, sounds like you're doing an unnecessary extra install to your project and the versions are in conflict. – codeth Feb 15 '21 at 23:56
  • Thank you for your answer, the jest was on the devDepencies, do I just do "npm install" or npm install something? – Tomas Mota Feb 16 '21 at 00:03
  • 1
    Just a plain old `npm install` after removing that line from the file. That will reinstall your project, which will remove any packages no longer listed. If it doesn't immediately solve your problem, first delete `node_modules` folder and `package-lock.json` then run again to ensure the correct `jest` version is installed. – codeth Feb 16 '21 at 00:15
  • Thank you, I deleted jest, ran npm install, and installed jest inside the project, which seemed to work, thank you very much for your time and patience. – Tomas Mota Feb 16 '21 at 00:20
  • Does this answer your question? [NPM start returns error, "There might be a problem with the project dependency tree"](https://stackoverflow.com/questions/56528222/npm-start-returns-error-there-might-be-a-problem-with-the-project-dependency-t) – Henke Mar 18 '22 at 14:12

1 Answers1

1

I just solved it. I have seen many people saying to reinstall the node_modules, that, unfortunately, did not work for me, here is listed what I have tried to do:

  1. Deleting the package-lock.json
  2. Deleting node_modules
  3. Removing jest from the dependencies and devDependencies
  4. Running npm install (to install the node_modules again)

None of that worked for me. What I did was, I removed jest from my computer, the whole app. Go to your cmd and type "npm rm jest", which should seal the deal. After that, I ran "npm install" inside my project on VSCode "ctrl + j" to open the terminal, then just went with "npm start" and it is now working. I am guessing that will also work if you get the same problem with other dependencies like Babel or something (I'm just guessing though, I am no expert in react or node).

Best of luck to anyone who is facing the same problem

Tomas Mota
  • 672
  • 5
  • 27