having an issue creating new react app with create-react-app - reactjs

I am trying to create a new react project, but when I run npx create-react-app tik-tok-clone I get the following error
Creating a new React app in C:\Users\mwars\Documents\GitHub\TikTok-Clone\tik-tok-clone.
Installing packages. This might take a couple of minutes.
Installing react, react-dom, and react-scripts with cra-template...
yarn add v1.22.4
[1/4] Resolving packages...
[2/4] Fetching packages...
error postcss#8.1.3: The engine "node" is incompatible with this module. Expected version "^10 || ^12 || >=14". Got "13.12.0"
error Found incompatible module.
info Visit https://yarnpkg.com/en/docs/cli/add for documentation about this command.
Aborting installation.
yarnpkg add --exact react react-dom react-scripts cra-template --cwd C:\Users\mwars\Documents\GitHub\TikTok-Clone\tik-tok-clone has failed.
Deleting generated file... package.json
Deleting generated file... yarn.lock
Deleting tik-tok-clone/ from C:\Users\mwars\Documents\GitHub\TikTok-Clone
Done.
I've been trying to figure it out for a while now and just can't get it to work.

I am was dealing with the same problem and have managed to understand and fix it. I will try to explain it below.
The issue:
error postcss#8.1.3: The engine "node" is incompatible with this module. Expected version "^10 || ^12 || >=14". Got "13.12.0"
This is telling you that the create_react_app module is only compatible with versions 10, 12, or greater than 14 of node and you are using 13.12.0.
The solution
To fix this error you need to either upgrade or downgrade your current version of node.
One way to do this is to use NVM (node version manager) to manage multiple versions of node.
To install it with either Linux or Mac you can use either of the following commands
For Wget, run the following command on the terminal:
wget -qO- https://raw.githubusercontent.com/nvm-sh/nvm/v0.35.3/install.sh | bash
For CURL, run the following:
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.35.3/install.sh | bash
You will want to change the version number in the commands to the latest stable version.
Once you have downloaded it successfully restart the terminal or you won't be able to find it. If this fails you may need to reset your computer.
If you have NVM installed running the following should show you the current version of it your using.
nvm --version
You can then use the following command to list available versions of node
nvm ls-remote
Select a compatible version and install it like so
nvm install 14.15.0
Running
node -v
Should show this as your current version if not try
nvm use v14.15.0
You should now have no issues running
npx create-react-app tik-tok-clone

It worked for me after running these commands.
sudo npm cache clean -f //clear you npm cache
sudo npm install -g n install n //(this might take a while)
sudo n stable upgrade //to the current stable version

Related

zsh: command not found: nx

I am trying to create a library in Angular using nx g #nrwl/angular:lib shared but it keep giving me error zsh: command not found: nx. All I did was before just create a angular project.
I try using this: npm install -g nx so maybe it install nx and it works, but I still keep getting the same error.
How can I fix this? I am using Mac.
If any questions or information needed please feel free to leave the comment down below.
sudo npm install -g nx fixed, sudo might be needed...
Try this: Install it globally by below command 100% will work
sudo npm i -g #nrwl/cli
remove -g if you don't want to install globally.
Either you don't have refreshed your zsh paths, which can be fixed by opening a new terminal or type
rehash
in the prompt.
If this doesn't work then nx isn't globally installed on your machine. You have to type
npm run nx [your command] instead of just "nx" to use it, so in your case:
npm run nx -- g #nrwl/angular:lib shared
Sources: https://nx.dev/latest/angular/cli/overview#installing-the-cli
Do we really need to install #nrwl/cli ?
Just installing the nx resolve the issue for me
sudo npm install -g nx#latest
Installing the nrwl cli globally should do the trick, you'll need to enter the super user mode to do it.
sudo npm i -g #nrwl/cli
Alternative solutions can be found on the guide on the Nx Website here
https://nx.dev/l/a/tutorial/01-create-application
Try this:
yarn global add #nrwl/cli

sails lift error in sail.js application in command prompt?

I try to run the sail application but I got an error when using sails lift.I followed the procedure to install the sail.js. I created one notepad file I uses the command node C:\Users\Vignesh Ravi\AppData\Roaming\npm\node_modules\sails\bin\sails.js lift and save as sails.bat file and put into C:\Windows\System32.but still I got an error can anyone solve this error? Thanks in advance....
I followed the procedure:
C:\Users\Vignesh Ravi>cd AppData
C:\Users\Vignesh Ravi\AppData>cd Roaming
C:\Users\Vignesh Ravi\AppData\Roaming>cd npm
C:\Users\Vignesh Ravi\AppData\Roaming\npm>sails new xyz
=====================================================
You seem to be using NPM >= v3.0.0, which no longer
supports symbolic links in the `node_modules/` folder.
As of Feb. 2016, the Sails team is still working on a
speedier solution to optimize `sails new` that will
be released as a 0.12.x patch. But in the mean time,
your new Sails app's dependencies must be set up
using `npm install`.
Because of this, creating your new Sails app will
take longer than you might be used to. Please bear
with us; or if you have a need for speed, downgrade
to NPM < v3.0.0 in the mean time. Thanks!
=====================================================
Installing dependencies... (this could take a little while)
npm WARN deprecated minimatch#2.0.10: Please update to minimatch 3.0.2 or higher to avoid a RegExp DoS issue
npm WARN prefer global coffee-script#1.10.0 should be installed with -g
npm notice created a lockfile as package-lock.json. You should commit this file.
added 261 packages in 22.306s
info: Created a new Sails app `xyz`!
C:\Users\Vignesh Ravi\AppData\Roaming\npm>cd xyz
C:\Users\Vignesh Ravi\AppData\Roaming\npm\xyz>npm install
up to date in 3.282s
C:\Users\Vignesh Ravi\AppData\Roaming\npm\xyz>sails lift
C:\Users\Vignesh Ravi\AppData\Roaming\npm\xyz>node C:\Users\Vignesh Ravi\AppData\Roaming\npm\node_modules\sails\bin\sails.js lift
module.js:487
throw err;
^
Error: Cannot find module 'C:\Users\Vignesh'
at Function.Module._resolveFilename (module.js:485:15)
at Function.Module._load (module.js:437:25)
at Function.Module.runMain (module.js:605:10)
at startup (bootstrap_node.js:158:16)
at bootstrap_node.js:575:3
Try this,
$ sails new sdc
$ cd sdc
$ npm install
$ sails lift
What you are missing?
You are running sails lift in a wrong directory

Angular theme start

I have problem with starting Angular theme. I have installed everything on this planet, and that wont work.
When i start gulp serve in cmd , this is response:
D:\Kolokvijumi\blur-admin-master\blur-admin-master\node_modules>gulp serve
[21:07:45] Working directory changed to D:\Kolokvijumi\blur-admin-master\blur-ad
min-master
[21:07:46] Using gulpfile D:\Kolokvijumi\blur-admin-master\blur-admin-master\gul
pfile.js
[21:07:46] Starting 'scripts'...
[21:07:46] Starting 'styles'...
[21:07:46] Starting 'stylesAuth'...
[21:07:46] Starting 'styles404'...
[21:07:46] Starting 'copyVendorImages'...
D:\Kolokvijumi\blur-admin-master\blur-admin-master\node_modules\eslint\lib\eslin
t.js:706
throw ex;
^
TypeError: Error while loading rule 'react/display-name': ruleCreator is not a f
unction
at D:\Kolokvijumi\blur-admin-master\blur-admin-master\node_modules\eslint\li
b\eslint.js:692:28
at Array.forEach (native)
at EventEmitter.module.exports.api.verify (D:\Kolokvijumi\blur-admin-master\
blur-admin-master\node_modules\eslint\lib\eslint.js:671:16)
at processText (D:\Kolokvijumi\blur-admin-master\blur-admin-master\node_modu
les\eslint\lib\cli-engine.js:230:27)
at CLIEngine.executeOnText (D:\Kolokvijumi\blur-admin-master\blur-admin-mast
er\node_modules\eslint\lib\cli-engine.js:686:26)
at verify (D:\Kolokvijumi\blur-admin-master\blur-admin-master\node_modules\g
ulp-eslint\index.js:20:17)
at Transform._transform (D:\Kolokvijumi\blur-admin-master\blur-admin-master\
node_modules\gulp-eslint\index.js:38:18)
at Transform._read (_stream_transform.js:167:10)
at Transform._write (_stream_transform.js:155:12)
at doWrite (_stream_writable.js:334:12)
I installed eslint, npm, babel-eslint but didnt help..
A couple of suggestions:
1) since npm is kinda buggy, you should definitely try to wipe you node_modules folder and give an npm cache clean command. After that try reinstalling everything again with npm install
2) which version of Node are you using? There may be any compatibility issues with your current node version and the one needed by you modules. You should also have to try to use nvm to manage multiple node version on your system
--- EDIT (after the other answer) ---
Probably you need to (re)install ESLint Config Defaults module.

Installing typescript definition manager

Hi I am trying to install the typescript definition manager (TSD) on my Ubuntu 14.04 VM. I am following the '5 minute tutotial' from Angular.
It says to run
npm install -g tsd#^0.6.0
After that I am supposed to run
tsd install angular2 es6-promise rx rx-lite
Anyway, after running the last command Ubuntu simply returns
tsd: command not found
Can anyone help here?
Can you run the npm install -g tsd again, it should output the location where it installs it for you.
In this case that location isn't added to your path variable and you should use a absolute location (or add it to your path).
You should be able to do this in ubuntu by creating a ~/.profile file with
export PATH=$PATH:/path/to/tsd/folder/
The problem in my case seemed to be the nodejs version on my Ubuntu VM. I created a new VM and installed nodejs the following way
cd /usr/local/src
wget http://nodejs.org/dist/v0.12.7/node-v0.12.7.tar.gz
tar -xvzf node-v0.12.7.tar.gz
cd node-v0.12.7
./configure
make
sudo make install
which node
After this I could run
tsd install angular2 es6-promise rx rx-lite
and everything worked as expected. SO I believe updating the my nodejs was the solution. It seems that my old nodejs did not add tsd to the path
Can anyone help here?
Check your node version. Recommend you use latest iojs. It works as shown :

Angular with Yeoman 1.0 and Grunt

Folks,
I am working on Win 7 professional.
Versions of various utilities on my computer are as follows:
Nodejs : v0.10.8
npm: v1.2.23
I am trying to seed the Angular application using Yeoman. I have followed the following instructions
First install yo,bower and grunt
npm install -g yo grunt-cli bower
Goto the directory where I want to create my webapp and run
c:\somefolder>yo angular
Runt the grunt server
C:>grunt server
Steps 1 and 2 above run fine but on step 3 I get the following errors
C:\somefolder>grunt -server
Running "clean:dist" (clean) task
Running "jshint:all" (jshint) task
3 files lint free.
Running "clean:server" (clean) task
Running "coffee:dist" (coffee) task
Running "coffee:test" (coffee) task
Running "compass:dist" (compass) task
Warning: You need to have Ruby and Compass installed and in your system PATH for this task to work. More info: https://github.com/gruntjs/grunt-contrib-compass Use --force to continue.
Aborted due to warnings.
Now I do have ruby installed and its available in PATH variable.
C:>ruby --version
ruby 2.0.0p195 (2013-05-14) [i386-mingw32]
How do I oversome this? How do i ensure that grunt server does not abort ?
Any help will be highly appreciated.
gem install compass
also here:
https://rubygems.org/gems/compass
I had the same problem as you mentioned and I noticed that Compass had to be called as compass2.0 so I symlinked compass to compass2.0 and it solved the problem.
Here's the command:
sudo ln -s /usr/bin/compass2.0 /usr/bin/compass
Hope this helps
I had this problem on OS X. Here is the series of commands I eventually used to get everything installed and working: https://gist.github.com/kristopherjohnson/f1d7e4d1c31ae3b0899e
FWIW, it seems like the missing piece for me was gem install sass. In theory, gem install compass should have installed Sass too, but explicitly installing Sass made the error disappear.

Resources