Create-react-app: Browser DOM doesn't reload/reflect changes after edits are made (Windows 64-bit)

Created on 13 Apr 2017  路  13Comments  路  Source: facebook/create-react-app

If you are reporting a bug, please fill in below. Otherwise feel free to remove this template entirely.

Can you reproduce the problem with latest npm?

Many errors, especially related to "missing modules", are due to npm bugs.

If you're using Windows, follow these instructions to update npm.

If you're using OS X or Linux, run this to update npm:

npm install -g npm@latest

cd your_project_directory
rm -rf node_modules
npm install

Then try to reproduce the issue again.

Can you still reproduce it?

Yes

Description

What are you reporting?

React-create-app doesn't make DOM changes when edits are made to App.js. Refresh doesn't show changes and hot module reload doesn't trigger. The app is boilerplate and no additional modules have been added.

Expected behavior

Tell us what you think should happen.

DOM should reflect changes made in the editor.

Actual behavior

Tell us what actually happens.

Nothing changes when code is edited nor when I refresh the browser. Even after code edits are made and hot module reload is set, I cannot get the DOM to reflect my changes until I kill the process. Other than that, the app starts successfully and renders the initial content. When I kill the process and restart, it shows my code edits but still allows no changes.

Environment

Run these commands in the project folder and fill in their results:

  1. npm ls react-scripts (if you haven鈥檛 ejected): -- [email protected]
  2. node -v: v6.9.5
  3. npm -v: 4.5.0

Then, specify:

  1. Operating system: Windows 7 64bit
  2. Browser and version: Chrome 57.0.2987.133

Reproducible Demo

Please take the time to create a new app that reproduces the issue.

Un-installed and Re-installed and nothing had changed.

Alternatively, you could copy your app that experiences the problem and start removing things until you鈥檙e left with the minimal reproducible demo.

(Accidentally, you might get to the root of your problem during that process.)

Push to GitHub and paste the link here.

By doing this, you're helping the Create React App contributors a big time!
Demonstrable issues gets fixed faster.

Most helpful comment

no parentheses in the filepath

Are you sure?

Program Files (x86)

All 13 comments

Have you had a chance to read this section of User Guide?

https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md#npm-start-doesnt-detect-changes

yeah, followed it and still had no changes. No safe edit set in VisualCode or Sublime.

Not a dropbox project, it can find the index.js file, no Writesafe settings are set, no parentheses in the filepath, not running OSX or Linux, and it's not on a VM.

Tried un-installing and re-installing but still doesn't change. Tried ejecting and editing the scripts but still nothing.

Thank you for your help!

Can you reproduce this on another machine? (In case you have access to more.)

I will try it again at work on OSX and update.

What is your full project path?

Also, which terminal are you using? Cmd? PowerShell? Git bash? It would help to try a few different ones.

full project path to the root is C:\Program Files (x86)\Ampps\www\reactapp. Using PowerShell. I will try out another terminal and see if that changes it.

(Redux is awesome btw! Thanks for making something so cool!)

no parentheses in the filepath

Are you sure?

Program Files (x86)

Doh! Didn't realize that it added it though we don't see it. Will edit and re-test.

I feel so dumb for not catching that, but that did it. Thank you!

No worries!

(It鈥檚 an annoying bug but I鈥檓 not sure if Webpack plans to fix it.)

same thing is happening for me on Ubuntu.. plz suggest

Was this page helpful?
0 / 5 - 0 ratings