I'm in WSL2, and my react app does not update any changes at all, only updates when re-running "npm start"

I've tried "npm install react-dotenv" and creating an .env file with FAST_REFRESH=false CHOKIDAR_USEPOLLING=true doesn't work

tried in the package.json "start": "CHOKIDAR_USEPOLLING=true react-scripts start" doesn't work

any suggestions? I don't even mind manually refreshing the browser, it's just that it won't update unless I restart the whole thing.

CodePudding user response：

You do not have to install an additional dotenv package since Create-React-App already supports environment variables natively. However if you use environment variables, you need to prefix them with REACT_APP. e. g. REACT_APP_MY_VARIABLE.

Also note: Whenever you update an environment variable you have to restart the app.

Take a look at the official CRA docs.

Now for the reloading problem. There are a couple of possible solutions:

• Add a .env file to your project without third party package and define a variable named FAST_REFRESH=false. (CRA advanced configuration)

• If you are using a Virtual Machine try adding CHOKIDAR_USEPOLLING=true to your .env file.

• There is another common problem in CRA ^17.0.1 with hot reloading (Github issue - Hot Reload stopped working with React "^17.0.1")

  if (module.hot) module.hot.accept();
  

• Finally (and this is the most likely solution in my opinion) try to move your project folder to somewhere, where npm can automatically recompile in WSL. E. g. move project from your desktop to your actual home directory.

CodePudding user response：

If you are using the CRA config it is implemented in version 0.2.3 or higher. Just create a .env file and add variables to the env file which start with REACT_APP_. Then u can just use your variable in any file with process.env.REACT_APP_YourName. If you want to set configuration variables you don't need the REACT_APP_.