Update npm start script and READMEs

README.md

@@ -4,8 +4,11 @@
 
 ```sh
 # Install dependencies
-npm install -D recharts tailwindcss postcss autoprefixer
+npm install -D recharts tailwindcss postcss autoprefixer nodemon
 
 # Initialize tailwind CSS (creates config files)
 npx tailwindcss init -p
+
+# Run the development server
+npm start
 ```

docs/README.dev-notes.md

@@ -4,8 +4,9 @@
 
 ```sh
 # Hard reset in case of version conflicts / existing installs
-npm uninstall tailwindcss postcss autoprefixer recharts
+npm uninstall tailwindcss postcss autoprefixer recharts nodemon
 npm install -D tailwindcss@^3.0.0 postcss@^8.0.0 autoprefixer@^10.0.0
+
 npm install --save recharts
 rm -rf node_modules package-lock.json
 
@@ -140,7 +141,7 @@ Just to rule out potential firewall issues, it is always an option to temporaril
 
 ## Development Server
 
-### Auto Open in Browser
+### (Prevent) Auto Open in Browser
 
 Per default, the React development server does automatically open the app in the browser when started. If this is not desired, add `BROWSER=none` to the `start` script in `package.json` as follows. Note that this also requires the `cross-env` package as described above.
 
@@ -156,6 +157,33 @@ Alternatively (not verified) a `.env` file can be created in the project root wi
 BROWSER=none
 ```
 
+### Hot Reloading File System Issues (in WSL)
+
+Install development dependency `nodemon` to monitor file changes and restart the server automatically.
+
+```sh
+npm install -D nodemon
+```
+Modify the `start` script in `package.json` to use `nodemon` with polling enabled. This helps in environments like WSL where file system events may not be detected properly.
+
+```json
+"scripts": {
+  "start": "cross-env HOST=0.0.0.0 BROWSER=none CHOKIDAR_USEPOLLING=true react-scripts start"
+}
+```
+
+Alternatively, add `CHOKIDAR_USEPOLLING=true` to a `.env` file in the project root:
+
+```ini
+echo CHOKIDAR_USEPOLLING=true >> .env
+```
+
+Then the `start` script can remain as:
+
+```sh
+npm start
+```
+
 ## Webhint
 
 ### Setup webhint in Project
@@ -235,5 +263,5 @@ npm uninstall -g hint
 
 ### External Resources
 
-* https://github.com/webhintio/hint
-* https://webhint.io/docs/user-guide/configuring-webhint/summary/
+* [https://github.com/webhintio/hint](https://github.com/webhintio/hint)
+* [https://webhint.io/docs/user-guide/configuring-webhint/summary/](https://webhint.io/docs/user-guide/configuring-webhint/summary/)

package.json

@@ -15,7 +15,7 @@
     "web-vitals": "^2.1.4"
   },
   "scripts": {
-    "start": "cross-env HOST=0.0.0.0 BROWSER=none react-scripts start",
+    "start": "cross-env HOST=0.0.0.0 BROWSER=none CHOKIDAR_USEPOLLING=true FAST_REFRESH=false react-scripts start",
     "build": "react-scripts build",
     "test": "react-scripts test",
     "eject": "react-scripts eject",