npm start hangs, does not sync changes (create-react-app on WSL) - node.js

I am new to web dev and am trying to follow the React tutorial. I have followed it successfully in the past on my machine. I am using Ubuntu 20.04 in WSL.
When I run:
npx create-react-app helloworld
cd helloworld
npm start
I get:
helloworld3#0.1.0 start /mnt/d/ProgrammingProjects/helloworld
react-scripts start
And it hangs there for about 5 minutes before the localhost opens. Once the localhost is open, it does not sync changes when I edit and save the App.js file.
I have tried completely uninstalling and reinstalling node and npm.

I was also having the problem with hot reloading in WSL2 . I tried almost every solution present on github , stackoverflow and where not . Trying to fix it from
CHOKIDAR_USEPOLLING=true to setting FAST_REFRESH = false in .env to changing network setting using netsh and what not for 2 days . finally decided to revert to WSL1.
I think it's because WSL 2 is running as a hyper-v virtual machine.
If you're using WSL2 you should revert to WSL1 for now.
wsl --set-version Ubuntu-18.04 1
Run the above command in Powershell. And check version of WSL after using
wsl -l -v
if it's version 1 now you are good to go.

Related

NEAR protocol - dev env set up on Windows 10 - error when executing npx create-near-app#latest

I am trying to set up the development env on Windows 10. Installed Node.js, yarn and RUST on windows. Then to set up the project, I tried "npx create-near-app#latest" and was prompted to install WSL.. which I did. I re-executed 'npx' command in ubuntu terminal that got installed with WSL but am still getting the same error:
s_wankhede#Sharad-Asus:~$ npx create-near-app#latest
'\wsl$\Ubuntu\home\s_wankhede'
CMD.EXE was started with the above path as the current directory.
UNC paths are not supported. Defaulting to Windows directory.
======================================================
👋 Welcome to NEAR! Learn more: https://docs.near.org/
🔧 Let's get your dApp ready.
======================================================
(NEAR collects anonymous information on the commands used. No personal information that could identify you is shared)
Notice: On Win32 please use WSL (Windows Subsystem for Linux).
https://docs.microsoft.com/en-us/windows/wsl/install
Exiting now.
Questions:
Should I be installing Node.js, yarn and RUST in ubuntu (WSL on windows 10)?
What can I do solve the problem?
OK. Finally I could figure it out after reading lot of articles and lots of trial and error. Here are the simple steps to resolve it and of course these are for machines running Windows.
Install Linux on Windows with WSL - https://learn.microsoft.com/en-us/windows/wsl/install This MUST be the first step
Install Node.js https://nodejs.org/en/download/
Install RUST - (I am writing contracts in RUST) - https://doc.rust-lang.org/book/ch01-01-installation.html Also add wasm toolchain: rustup target add wasm32-unknown-unknown
Install Yarn : npm install -g yarn
Set up the project : npx create-near-app#latest

Npm package commands stopped working after installing Homebrew on Mac

I'm using nodemon for my node.js project and wanted to install MongoDB locally on my Mac which runs Catalina 10.15.7. For that I installed the latest version of Homebrew. I started the MongoDB server sucessfully and connected to it with MongoDB compass.
After that I switched back to my nodejs project and noticed that in my zsh terminal (in Visual Studio Code) I suddenly couldn't use the nodemon command anymore. I get the error:
zsh: command not found: nodemon
I reinstalled nodemon in the project and globally too but that didn't work. I read that it's a problem with the .zshrc file so I tried to create one with the nano editor and add
echo 'export PATH=~/.npm-global/bin:$PATH' >> ~/.zshrc
but that didn't work either (I tried to replace npm-global with npm-package).
At this point I have no idea where the issue is. Any suggestions?
I don't know why but reinstalling nodemon globally with sudo worked somehow.

Why Node not found when running react-scripts?

Created a default create-react-app project. And tried to run it yarn start. Tried to run it in cmd, powershell.
And getting an error:
my-app/node_modules/.bin/react-scripts: node: not found
This is the problematic line in the script:
node "$basedir/../react-scripts/bin/react-scripts.js" "$#" <-- node not found
I checked my PATH vars and set a high priority for C:\Program Files\nodejs
Reinstalled node.js and installed a different version 12.14
UPDATE:
If I run it in bash it works properly. But still, though need to solve it on other terminals
The problem was I had installed WSL and somehow it was running in that environment and there wasn't Node installed there. So I removed WSL and now it runs okay.

React: npm start - windows cannot find localhost

I am trying to follow tutorials for basic react-build-app.
ENVIRONMENT
I am using Ubuntu on Windows 10.
Node version: v13.3.0
NPM version: 6.13.1
So far I did,
npm install -g create-react-app
create-react-app calculator
cd calculator
npm start
PROBLEM
When I run npm start, I get pop up dialog from windows saying, Windows cannot find '\https://localhost:3000/\'. Make sure you typed the name correctly, and then try again.
Here is a screenshot of the error
However, in the cli, I see
Local: http://localhost:3000/
On Your Network: http://192.168.56.1:3000/
Note that the development build is not optimized.
To create a production build, use npm run build.```
But when I open my browser and go to http://localhost:3000/, I only see a blank page, and not the normal React logo.
EXPECTED OUTPUT
I should see the react logo when going to http://localhost:3000/, and not receive and error.
ATTEMPTS
Updated nodejs and npm.
Changed ports using package.json. Also tried
using .env file to change port. Same error.
Uninstalled and re-installed ubuntu 18.04 LTS and used NVM to install nodejs and npm.
WORKAROUND
I got tired of fixing error after error with linux, so I just set up npm and nodejs on windows instead. ran create-react-app on windows cli and it worked the first time. Told me something else was listening on the port i was trying to open, so prompted me to change port. I said yes. Now I get the landing page I was looking for.
I am very new at this and have been trying to figure this out for a couple days now, I would appreciate any advice. Thank you.
This is a WSL specific issue with one of the dependencies of react-scripts, more specifically open version 7.0.0.
To resolve, you can:
switch to react-scripts 3.2.0 in your package.json, or
run npm start from something else than WSL (e.g. Powershell), or
wait for open and react to fix the issue
Bug report in React Scripts:
https://github.com/facebook/create-react-app/issues/8081
And the corresponding bug report in open:
https://github.com/sindresorhus/open/issues/154
According to this post in the bug report in open the culprit is lines 76 & 77 of index.js in node_modules/open. If you comment them out then it works fine.
Link to comment:
https://github.com/sindresorhus/open/issues/154#issuecomment-562509596

Node cli on Msysgit on WIndows 10

I recently decided to pick up Node on my personal laptop, which I upgraded to Windows 10, and the Node cli seems to hang when I try to run it.
Simply typing node on the console will not initiate the interface, and to do anything else I need to Ctrl+C out of it.
Additionally, running some npm commands take longer than they used to on my laptop. More noticeably, npm init seems to hang after confirming the information to be written to package.json.
Node version is 4.0.0
npm version is 2.14.2
Are there any known issues with Node and npm on Windows 10?
Edit:
After some troubleshooting, I've figured out the error only happens on Msysgit. Neither of the issues happen on the standard command prompt of Windows.
I had the same issue on Windows 7 with Node version 6.11.0 and Msysgit's MINGW64 terminal window.
The problem was caused by the an alias provided by Msysgit as demonstrated below:
$ alias node
alias node='winpty node.exe'
The solution is to run the command:
$ unalias node
Then node will run correctly.
You can add the unalias node command into your .bashrc file in your HOME directory to make this permanent.
Good luck!
Jeff

Resources