unable to create a new project with create-react-app - node.js

I've just finished installing create-react-app successfully.
But, when I create a new project like below command, error happens.
Could you please give me a recommandation?
system env.:
- aws lightsail 1vcpu, 0.5G ram / ubuntu 18.04
- nodejs version : 13.9.0
- npm version : 6.13.7
- create-react-app version : 3.4.0
~$ npm create-react-app my-app
Installing packages. This might take a couple of minutes.
Installing react, react-dom, and react-scripts with cra-template...
core-js#2.6.11 postinstall /home/ubuntu/my-app/node_modules/babel-runtime/node_modules/core-js
node -e "try{require('./postinstall')}catch(e){}"
Aborting installation.
npm install --save --save-exact --loglevel error react react-dom react-scripts cra-template has failed.
Deleting generated file... node_modules
Deleting generated file... package.json
Done.

Switch to Yarn
It was a raised issue on github a couple of years back..
it was solved after switching to yarn.
These commands could not solve the issue.
npm cache clean --force
create-react-app my-apps
Switching to Yarn worked!
npm install -g yarn
yarn global add create-react-app
create-react-app my-app
See if this helps!

This error is due to the fact that a dependant module named core-js is trying to run a post-install script. This post-install script spawns a child process and runs a shell script there. For some reason Node sets/assumes a wrong bash path by default. I had to manually change the path by running the following command.
npm config set script-shell $(which sh)
Note: For Windows you might have to setup your own bash.exe by installing something like git-bash and then you could assign the path similarly.

Try this: npm cache clean --force

Related

Why npx create-react-app is showing "the project was bootstrapped with an old unsupported version of tools"?

I recently switched to Ubuntu, whenever I create react app it's giving me this note, and the app it's creating is a class component.
ankit#gram:~/Documents/Development/React/react-project$ npx create-react-app my-app
Creating a new React app in /home/ankit/Documents/Development/React/react-project/my-app.
Installing packages. This might take a couple of minutes.
Installing react, react-dom, and react-scripts...
added 987 packages in 39s
22 packages are looking for funding
run `npm fund` for details
Success! Created my-app at /home/ankit/Documents/Development/React/react-project/my-app
Inside that directory, you can run several commands:
npm start
Starts the development server.
npm run build
Bundles the app into static files for production.
npm test
Starts the test runner.
npm run eject
Removes this tool and copies build dependencies, configuration files
and scripts into the app directory. If you do this, you can’t go back!
We suggest that you begin by typing:
cd my-app
npm start
Happy hacking!
Note: the project was bootstrapped with an old unsupported version of tools.
Please update to Node >=14 and npm >=6 to get supported tools in new projects.
my node version: v16.14.0
my npm version:8.3.1
I think this was because npx was not installed in my system, when I created a react app by this command create-react-app the app created was fine. I also installed npx using this command npm install -g npx and created a react app and everything was fine. before this make sure you have installed create-react-app in your system if not then install it by using this command
sudo npm install -g create-react-app
I am a new programmer had this issue not long ago I just solved it.
Use sudo apt install nodejs
It will automatically install version 10 for you which doesn't accept React.
Then you try to install NVM package, use it to update your node to a newer version.
You can check me on GitHub bari racha Wuye
I was having the same problem after I had just installed Ubuntu 22.04.
The fix for me was updating node and npm by following these instructions free code camp update node and npm
Specifically, I followed the instructions under the heading "1. Use NPM to Update Your Node Version", to update node and ignored the 2nd and 3rd headings, then followed the instructions under the last heading to update npm
afterwards I restarted my computer, opened the project directory and ran the command
npm i create-react-app#latest
then I ran
npx create-react-app projectname
and it worked as expected

`npx create-react-app` says it requires "Node 14 or higher" but I'm running 17.4.0. How can I fix this?

I'm trying to start a new React project on my Mac (running Mojave 10.14.5).
In VS Code's Terminal I ran npx create-react-app my-app and got a message saying that my version of Node was out of date. I updated node to version 17.4.0 and ran it again - still got the same message.
I then ran clear cache: npm cache clean --force and tried again - still no luck.
node -v says I'm running 17.4.0.
Would anyone know what I could do?
The first thing you need to do is to uninstall the create-react-app and then npm install it again.
You can use these commands for uninstalling the create-react-app:
if you are using NPM:
npm uninstall -g create-react-app
if you are using Yarn:
yarn global remove create-react-app
for creating new app you can use the following command:
npx create-react-app#latest your-project-name
You must notice that the create-react-app should not be installed globally as it is documented in Create-React-app Docs.
Also please note that it is safe to say, always use the LTS version of node (that is 16.13.2 at this time).
It should solve your problem with initiating a new react app.

Angular 9 ng new myapp gives error The Schematic workflow failed

I have angular 9 installed
Angular CLI: 9.0.1 Node: 13.8.0 OS: win32 x64
Angular: ... Ivy Workspace:
Package Version
#angular-devkit/architect 0.900.1
#angular-devkit/core 9.0.1
#angular-devkit/schematics 9.0.1
#schematics/angular 9.0.1
#schematics/update 0.900.1
rxjs 6.5.3
Everytime i try to create a new project with ng new, I'm getting the message
Installing packages...npm WARN deprecated request#2.88.2: request has been deprecated, see https://github.com/request/request/issues/3142
npm ERR! Unexpected end of JSON input while parsing near '...pm-signature":"-----B'
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\Lijo John Daniel\AppData\Roaming\npm-cache_logs\2020-02-12T09_52_57_342Z-debug.log
× Package install failed, see above.
The Schematic workflow failed. See above.
I have tried re-installing angular and even node but issue still remains
My OS version is Win 10 v.1909 build 18363.592. Can someone help me with this?
First ,verify your NPM cached memory
npm cache verify
then try :
npm cache clean --force
npm install –g #angular/cli#latest
ng new <YourProjectName>
If the problem persists, then try the following
npm cache clean --force
npm update
ng new <YourProjectName>
NOTE
As #0210vidit said in the comment below:
do not use dash(-) or (.) in naming
Try to clean the npm cache using:
npm cache clean --force
then should it works now,
ng new my-app
I had similar issue and installing yarn or clearing cache didn't help.
I removed '-' from my app name and it worked
Error :
ng new first-app
Solved:
ng new firstapp
Hope it helps.
This issue is reported for angular 9 and multiple geo-locations are facing this problem.
refer https://github.com/angular/angular-cli/issues/16944
to proceed you can bring you angular version to 8 with below steps
ng --version
npm uninstall -g #angular/cli
npm cache clean --force
npm install -g #angular/cli#8.0.0
ng --version
I had this issue since yesterday, tried all of this and it did not work. Then I installed yarn, and configured angular cli to use yarn as the packagemanager by running this command
ng config -g cli.packageManager yarn, and it worked.
First try the following
npm cache clean --force
npm install -g #angular/cli
ng new <project-name>
If the problem persists, then try this (this eventually solved my workflow issue)
npm cache clean --force
npm update
ng new <project-name>
Thanks!
In my case i've tried everything with npm and no way out.
But with yarn worked with no worries!
I'm a windows user but you can find how to install in other OS in yarn website!
1st - i downloaded yarn from his website yarn
2nd - installed the global package with vs terminal:
yarn global add #angular/cli
3rd - still in vs terminal set: ng config -g cli.packageManager yarn
4th - i created my app: ng new myapp
5th - so you know te rest ...
Worked fine to me!
I removed my previous solution as I somehow got hung up on the uninstalled node_modules part and presented a solution that probably wouldn't have been relevant. Here is an alternate solution that might work for you...
Open a new terminal and run node -v and then npm -v to make sure you are running compatible versions: "Node 8.9 or higher, together with NPM 5.5.1 or higher"
Uninstall your current Global Angular cli npm uninstall -g #angular/cli
Run npm cache verify
Re-Install Angular CLI npm install -g #angular/cli#latest
Close your terminal window (just because).
Open a new terminal window, browse to where you want your new project and try the 'ng new` command again.
This work fine top of all solutions and worked for me on Windows 10...
Go to vs code new terminal type the following in order
npm install --global yarn
yarn global add #angular/cli
ng config -g cli.packageManager yarn
ng new projectname
this will fix the issue..
npm uninstall -g #angular/cli
npm cache clean --force
npm install -g #angular/cli
then should it works now,
ng new my-app
I got it working, first I installed angular 8 then ran npm install -g #angular/cli#latest.
It updated to angular 9 and now i'm able to create new projects. Thank you all for your consideration
Angular 9 ng new myapp gives error The Schematic workflow failed......
Firstly, uninstall Angular: npm uninstall -g #angular/cli
After uninstall, you should do clean Angular cache: npm cache clean --force
After this, you should do re-install Angular globally: npm install -g #angular/cli
And check the version: ng --version
Now you can create your app: ng new your-app
Only solution worked for me
Clear NPM cache + uninstall node
Install Node.js
Install Angular CLI
This will cost you some Internet data, but better option than wandering around for nothing! Keep a back up of Node.js. Useful next time.
Here is the simple way, i am sure it will help because this is the error with package installation failed.
Skip node packages for now and use this command to create new app.
ng new YourAppName --skip-install
after that just go into your project directory and run npm install it will install all required packages for you.
I struggled with this type of issue for a while.
Adding the following environment variable to your user account should solve the issue, adding a temporary cache option.
name: npm_config_cache
value: /tmp/empty-cache
More information concerning npm-config .
Always update to the latest LTS version of Nodejs before using angular cli current version.
as a temporary fix you can manually install "error-ex" module directly from GitHub then install your dependencies as mentioned here facebook/create-react-app#8465 (comment)
$ npm i https://github.com/Qix-/node-error-ex
$ npm i
I had this issue then I navigate to the file .angular-config path C:\Users\username and change "packageManager" : "npm"
{
"version": 1,
"cli": {
"analytics": "_________",
"packageManager": "npm"
}
}
I had the same problem, after a lot of search and two day of trying many ways, I finally solved my problem by installing codelyzer.
first run this command in cmd:
npm install -g codelyzer
then run:
ng new yourProject
This must work because I had a similar problem
npm install -g #angulat/cli
npm install mkdirp
npm cache verify
close terminal and open again
ng new your project name
if it doesn't work, turn your firewall off and do them again. I bet it will work.
I had the same problem, this command resolved my problem:
ng config -g cli.packageManager yarn
This issue arises mostly because of the npm cache still keeping this error. All you need to do is to force clean the npm cache and try creating your app again.
npm cache clean --force
ng new myapp
I got the same error. Before you reinstall the Angular CLI you have to check your internet connection and its speed. In my case, the error has occurred because my internet connection was interrupting. I could resolve that issue after I fixed my connection issue.
Ensure cli is in a small case and package looks like #angular/cli during installation. I have followed this in some tutorial to solve this issue.
Please install new node js updated version and angular CLI as well.
will surely solve your problem.
npm cache clean --force
ng new my-app --skip-install
cd my-app
npm i
ng serve
I got this error when updating npm to 7.x.x
So if you want to use angular12 based on angular-cli-node-js-typescript-compatiblity-matrix version of node and npm should be like this :
node : 12.13.x - 14.15.x
npm : 6.x.x - 7
I used nvm for mange version of node
I had a similar problem, which I solved like this:
npm install -g npm#latest
npm cache clean --force
ng new project-name
Follow this way to solve this issue
Open a new terminal and run node -v and then npm -v to make sure you are running compatible versions: "Node 8.9 or higher, together with NPM 5.5.1 or higher"
Uninstall your current Global Angular cli npm uninstall -g #angular/cli
Run npm cache verify
Re-Install Angular CLI npm install -g #angular/cli#latest
Close your terminal window.
Open a new terminal window, browse to where you want your new project and try the 'ng new` command again.
Hi try all above suggestion clearing the cache, reinnstalling ng, ...
Restarting my server did the trick..

Npm commands downloaded but not recognize

So I recently update node js pretty much since I was gonna try Angular but now when I try to run any command like create-react-app appname I start to get this.
C:\Users\Mine\AppData\Roaming\npm/node_modules/node/bin/node: line 1:
This: command not found
now I checked my Environmental variables and on top of my Path folder I have
C:\Users\Mine\AppData\Roaming\npm which im pretty sure is the correct
path.
I've tried to change the path to programfiles\node and it did not work as well.
i think you should after update node js uninstall create-react-app
npm uninstall create-react-app
npm uninstall -g create-react-app
npm cache clean --force
at the next
npm install -g create-react-app
Once installation successful, try running
npx create-react-app hello-world
Note
npx on the first line is not a typo — it’s a package runner tool that
comes with npm 5.2+.

create-react-app command aborting installation Why?

windows 10
node v10.15.1
npm v6.8.0;
I:\>npx create-react-app newpomodoro
Creating a new React app in I:\newpomodoro.
Installing packages. This might take a couple of minutes.
Installing react, react-dom, and react-scripts...
npm ERR! Unexpected end of JSON input while parsing near '...:"^2.2.x","topo":"1.x'
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\Administrator\AppData\Roaming\npm-cache_logs\2019-03-03T17_21_57_703Z-debug.log
Aborting installation.
npm install --save --save-exact --loglevel error react react-dom react-scripts has failed.
Deleting generated file... package.json
Deleting newpomodoro/ from I:\
Done.
I installed react globaly and loacaly as well but still it was giving me same error.
Can anyBody tell me whats going wrong.
Use this command:
npm cache clean --force
I am having this same problem with npm install --save --save-exact --loglevel error react react-dom react-scripts has failed. Mine then deletes node_modules and package.json. I have asked about this here: NPX create-react-app aborting installation after vulnerabilities found
I have already tried to use npm cache clean --force but this has not solved the problem. I have also tried installing different versions of node.js to no avail.
I ran into a similar issue. I don't know if you might have been in the same boat, but the cause was a space in my path name. I often save my projects on google file stream which has a space in the name ("G:/My Drive/..."). I tried creating the app in another directory and moving the folder which ended up working out.
The command npm clean --cache won't help.
If you are facing an abort installation error in react.
The abort installation error generated because of the older node version.
you should update your node package version.
To solve, run the following command and it will solve the abort installation error.
nvm install node 12.18.0
So, update your node package to the latest one. Once you've updated your node package then create your react app as follows:
npx create-react-app <your-app-name>
The abort installation error occurred because the outdated version of your node was not supporting the create-react-app command and deleted the node_modules and package.json file
Try this, please. It solved my error and hopefully, it'll solve your error too.
The issue was in node version just update it to latest version and it work's for me!
https://nodejs.org/en/download/
here is the solution which works for me, first of all, you should update all of your dependencies
then ran the command
npm cache clean --force
after that you can use
npx create-react-app

Resources