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:
"babel-eslint": "9.0.0"
Don't try to install it manually: your package manager does it automatically.
However, a different version of babel-eslint was detected higher up in the tree:
create .env file in your project file and add the following statement
SKIP_PREFLIGHT_CHECK=true
Save the file
Remove node_modules, yarn.lock, package.lock
Then reinstall node_modules with
npm install
This should work
I had the same problem and do all the suggested steps but the problem still, so, my error is that i have a reactApp inside other Javascript App i had this structure.
--MyProjects
----NodeJsApp
----node_modules of NodeJsApp
----package.json of NodeJsApp
----ReactApp
------node_modules of ReactApp
------package.json of ReactApp
The problem solved to me deleting my ReactApp node_modules directory, then i do a reestructure of my directories because i have a disaster.
--MyProjects
----NewDirectory (inside all about NodeJsApp)
------node_modules of NodeJsApp
------package.json of NodeJsApp
----ReactApp
------package.json of ReactApp
After that i do :
npm install
and then npm start and my problem has fixed, i think that the problem is that the parent directory cant have a javascript /nodeJs/ project or something that have node_modules .
Part of the output you provided says:
Check if C:\Users\chawki\node_modules\babel-eslint is outside your project directory. For example, you might have accidentally installed something in your home folder.
Browse to C:\Users\chawki\node_modules\ and delete the babel-eslint folder, or simply delete C:\Users\chawki\node_modules.
I just deleted the node_modules folder (for me it was C:\user\[yourUserName]\node_modules\) and re-installed it.
Here What i did...
C:\user\[yourUserName]\node_modules\babel-eslint and delete the file
C:\user\[yourUserName]\node_modules\eslint and delete the file
Delete your eslint and babel-eslint file from your node modules on your computer e.g. -C:\Users\vishnu\node_modules -delete eslint and babel-eslint file.
In your project:
yarn remove eslint
yarn add --dev eslint#6.1.0
yarn remove babel-eslint
yarn add --dev babel-eslint#10.0.3
If you dont want to create .env file there is another alternative you can pass the SKIP_PREFLIGHT_CHECK=true directly in the script.
For Example
"start": "SKIP_PREFLIGHT_CHECK=true react-scripts start",
in package.json
resolutions:{
"babel-eslint": "9.0.0"
}
if you reinstall your all dependencies, you will be forcing "babel-eslint" to be version "9.0.0". if you start your app, you will have no issue.
My problem was I installed webpack as a global package... after i deleted webpact and run npm install, the problem was gone
Make sure you don't have a global webpack package or somewhere higher up the directory structure.
In my case, I had it globally installed. Deleting and then running npm install and then npm start worked perfectly.
Run npm ls babel-eslint and see which dependencies are using it or installing another version. Try updating those libraries.
It worked for me.
Related
My professor wants us to submit our project for our node.js app but we are not allowed to include node_modules in the submission.
When I try to run the app without the folder in there, it crashes due to missing dependencies.
Am i missing a step?
Presumably either
you're not supposed to use third-party dependencies in your solution (just the core Node.js modules), or
you're not supposed to include node_modules in your submission (which is good practice anyway), but instead just have a package.json (and possibly a lockfile) so your instructor can npm i / yarn to install the packages.
When building an app that has node_modules you aren't supposed to include this anyway.
Install any node_modules that are required for your application to run and when sibmitting just leave out the node_modules folder.
Your package file will include everything that your instructor can check over or install on their end if necessary.
I found this random example on github: https://github.com/hayanisaid/nextjs-intro-example
As you can see by looking they have there package files but no node_modules, when you clone this repo you would run npm install which would create and install the packages
package.json contains information about node modeuless.
If u deleted node modules, you just have to run npm i --save.
All the dependency will be downloaded through this.
Just use npm/yarn install if you remove the folder.
This question already has answers here:
'npm start' returns error: "There might be a problem with the project dependency tree"
(24 answers)
Closed 12 months ago.
PS C:\Users\joshm\Downloads\SMARTcontract\~\metaplex\js\packages\candy-machine-ui> yarn start
yarn run v1.22.17
$ react-scripts start
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:
"babel-eslint": "^10.1.0"
Don't try to install it manually: your package manager does it automatically.
However, a different version of babel-eslint was detected higher up in the tree:
C:\Users\joshm\node_modules\babel-eslint (version: 10.0.1)
Manually installing incompatible versions is known to cause hard-to-debug issues.
If you would prefer to ignore this check, add SKIP_PREFLIGHT_CHECK=true to an .env file in your project.
That will permanently disable this message but you might encounter other issues.
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 "babel-eslint" 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\joshm\node_modules\babel-eslint is outside your project directory.
For example, you might have accidentally installed something in your home folder.
7. Try running npm ls babel-eslint in your project folder.
This will tell you which other package (apart from the expected react-scripts) installed babel-eslint.
If nothing else helps, add SKIP_PREFLIGHT_CHECK=true to an .env file in your project.
That would permanently disable this preflight check in case you want to proceed anyway.
P.S. We know this message is long but please read the steps above :-) We hope you find them helpful!
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
Create a .env file in your project directory, and add the following code:
SKIP_PREFLIGHT_CHECK=true
Then, remove the node_modules folder, yarn.lock file and reinstall your node modules with
npm install
I've tried installing jest for testing react apps
After installing them with yarn, I'm unable to start my react app any way
I'm getting the below message, but it didn't work.
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:
"babel-jest": "^24.9.0"
Don't try to install it manually: your package manager does it
automatically. However, a different version of babel-jest was detected
higher up in the tree:
C:\Users\YV\node_modules\babel-jest (version: 27.0.5)
Manually installing incompatible versions is known to cause
hard-to-debug issues.
If you would prefer to ignore this check, add
SKIP_PREFLIGHT_CHECK=true to an .env file in your project. That will
permanently disable this message but you might encounter other issues.
To fix the dependency tree, try following the steps below in the exact
order:
Delete package-lock.json (not package.json!) and/or yarn.lock in your project folder.
Delete node_modules in your project folder.
Remove "babel-jest" from dependencies and/or devDependencies in the package.json file in your project folder.
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:
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.
Check if C:\Users\YV\node_modules\babel-jest is outside your project directory.
For example, you might have accidentally installed something in your home folder.
Try running npm ls babel-jest in your project folder.
This will tell you which other package (apart from the expected react-scripts) installed babel-jest.
If nothing else helps, add SKIP_PREFLIGHT_CHECK=true to an .env file
in your project. That would permanently disable this preflight check
in case you want to proceed anyway.
P.S. We know this message is long but please read the steps above :-)
We hope you find them helpful!
I just had the same issue and fixed it. So, you probably installed jest globally on accident. In doing so, it likely ended up installed inside of users/yourname/node-modules/. If you can pull up a terminal, try doing a cd into node-modules from your home folder then do a ls -a. If you see babel-jest, do a rm -r babel-jest and rm -r jest. This fixed the problem for me. I'm running Linux, but the same strategy should work on Windows (not sure if the commands are exactly the same).
You probably installed a different global (npm install -g) version that is currently conflicting with the one you installed in your project.
You can quite literally delete the folder babel-jest inside C:\Users\YV\node_modules\ and try again. I would assume you're doing this by using create-react-app. Rest assured that Jest is already part of the installed dependencies (hence the message pointing to package-lock.json).
I am trying to create a project (named ngadmin) via the angular cli but it throws errors on this command: ng new ngadmin. The errors are:
fs: re-evaluating native module sources is not supported. If you are
using the graceful-fs module, please update it to a more recent
version.
You cannot use the new command inside an angular-cli project.
I am not sure what the problem is as this cli was working fine for me a few days ago.
Check in your username folder, if there is package.json and node_module exist. If they are there then delete them.
Notice: you may have created an angular project in your home/username directory. If you delete them it will work.
If using Linux, go to home and delete package.json.
I had this problem as well. Here is how I fixed it:
Go to package.json
Under "Dependencies", find "angular-cli": "^1.0.0-beta.18"
Delete this line ("angular-cli": "^1.0.0-beta.18")
Save file
Hope that helps!
The first warning regarding graceful-fs is due to the fact that angular-cli uses older version of graceful-fs pkg, nothing to worry about that.
The error "You cannot use the new command inside an angular-cli project" signifies you are inside an angular cli project, get out of the angular cli project using cd .. command and try running the command ng new ngadmin it will work.
there is a file package.json
Simply remove it and then Create project.
it will work for sure
Seems like i fixed my problem. I have no idea what happened but i noticed system32 was not in my PATH so i added that and uninstalled and reinstalled the angular-cli package. everything works like a charm now
I had the same issue, the thing was I was not closely following along the tutorial I was watching and I tried using the same directory, I used cd .. to move up in the file structure and it worked like a charm, hope this helps!
i had the same problem today, I started a fresh project and did
npm install -save #angular/cli
and received the error.
I just renamed the package.json to .json2 temporarily and it worked.
Delete the file package.json in current directory where you are trying to create. Then try to install again.
In windows cd/User,Find the package.json,package-lock.json file and delete both the files.
Restart your command prompt and you are ready to go.And try to use this command
npm install --save-dev #angular/cli#latest
You must have used local "npm install #angular/cli" command to install angular locally in your project.
Uninstall local angular using "npm uninstall #angular/cli"
install angular globally using "npm install -g #angular/cli"
and then try "ng new ngadmin"
Because "ng new projectName" will automatically install angular/cli locally as a dev-dependency
I have a package (package-a) that depends on another package (package-b) which is not published to npm but is on my file system. When I run npm install from package-a, package-b's dependencies are not installed. I have to navigate to package-b's directory and run npm install manually. Is there a way to install both packages' dependencies with a single npm command?
Here's my directory structure:
/
...
shared/
...
javascript/
...
package-b/
package.json
package-a/
package.json
Per the docs, I placed the following in package-a/package.json. (I'm using npm 5+)
dependencies: {
package-b: "file:../shared/javascript/package-b",
}
When I navigate to /package-a and run npm install, it installs all of package-a's dependencies like normal and also copies the package-b directory to package-a/node_modules. This is presumably what lets me type require('package-b') instead of require('../shared/javascript/package-b') .
However, as I stated before, package-bs dependencies are not installed, so if I try to use package-a, I get an error when package-b is required because it is trying to use dependencies that do not exist locally.
Once again, to solve this, I can navigate to package-b and run npm-install, but I'm hoping there's a better solution as I may have many such sub packages and I'd like to avoid having to write a shell script to go install all my dependencies if I can do this with an npm command. (perhaps I just did something wrong and npm install should be working?)
Follow up question: when I run npm install from package-b's directory, the packages are installed there, but not in the version of package-b that got copied to /package-a/node_modules during the first npm install, yet everything still works. So now it seems like when I require('package-b') it is actually resolving to /shared/javascript/package-b and NOT /package-a/node_modules/package-b. So what's the point of copying the file in the first place?
Update
It turns out this is a bug in npm 5. It only occurrs when installing from a package-lock.json file. (Github Issue)
The files are (probably) not being copied, they're being symbolically linked (symlink). This essentially creates an alias/shortcut that looks like a real directory, but points to another path.
This is how the older npm link feature worked. The reason is the code stays "live"; Changes in the linked module are reflected whenever you run the module that's referencing them, meaning you don't have to npm update all the time.