cheslijones
cheslijones

Reputation: 9194

npm start not refreshing new content on save on one computer, but is on another with almost exact same setup

I have my work computer which is a Windows 10 Pro and my laptop is a Windows 10 Home. Working on the same project on both: push and pull to Git. Learning React through Udemy. Both computers using Chrome. Both using Bash on Ubuntu on Windows with latest updates. Both using ConEmu for the console. Both npm -v = 3.10.10. Both node -v = 6.11.2. Hardware is different obviously, but not sure that is relevant and worth listing.

Anyway, this starter project I am playing around with, when I make changes to it and npm start is running, you can see activity in the console, hit refresh in the browser, and any changes made will be reflected.

On the laptop, this process does not work. Make change, save, no activity in console, refresh in browser does not reflect the changes. Have to restart npm start for changes to be reflected. A little irritating to say the least.

Anyway idea what might cause this? Really haven't come across anything in my Googling efforts.

Upvotes: 16

Views: 38090

Answers (5)

Bea Figueroa Tielas
Bea Figueroa Tielas

Reputation: 21

I have had the same problem, npm start started the project but it did not show the changes it was making. In my case the problem was with the WSL version, when installing it in Windows version 2 is installed by default, when changing to 1, everything works without any problem.

To check the version of wls use this command in the windows terminal (PowerShell), not in WLS:

wsl -l -v

To fix (when putting the first command, copy the version of Ubuntu installed to use the second command):

C:\>wsl --list --verbose

NAME            STATE           VERSION
Ubuntu-20.04    Running         1

C:\>wsl --set-version Ubuntu-20.04 1

I leave this info here in case it can help someone

Upvotes: 2

apg
apg

Reputation: 59

For me, working in Windows, WSL2 caused this not to work. Running npm start in Command Prompt, not WSL solved this issue for me.

Upvotes: 1

tfist97
tfist97

Reputation: 161

If you are using npm in WSL2.0 for development, please refer the last point in this- https://create-react-app.dev/docs/troubleshooting/#npm-start-doesnt-detect-changes

While WSL1.0 doesn't use a VM, WSL2.0 does use a lightweight VM, so adding

CHOKIDAR_USEPOLLING=true 

in a .env file in the project directory fixed the problem.

On a sidenote, you might wanna take a look at this

Upvotes: 16

Juan Rosales Vargas
Juan Rosales Vargas

Reputation: 116

I just add file .env and inside FAST_REFRESH=false.

Upvotes: 1

posit labs
posit labs

Reputation: 9471

Client side

To ensure client side changes aren't being cached, you can open devtools > Network, and check "Disable cache". After enabling this, you won't have anything in the cache as long as devtools is open.

Alternatively, you can use incognito / private browsing mode to prevent the cache from holding on to things.

Server side

I'm sure you've realized that it's a pain to restart your server every time you want to see your code update. There are several tools that will detect file changes and handle restarting the server automatically.

Upvotes: 6

Related Questions