Add note for using CHOKIDAR_USEPOLLING in virtual machines to enable HMR (#1608)

* Add note for using CHOKIDAR_USEPOLLING in virtual machines to enable HMR

* Use br in react-scripts template README md

* Use br in md for new line breaks

* Update troubleshooting HMR to allow for VMs running Windows

* Fix up the instructions
This commit is contained in:
Alexander James Phillips
2017-02-22 18:37:18 +00:00
committed by Dan Abramov
parent 1aa4b2b8cb
commit 2a8535b5d5
10 changed files with 24 additions and 23 deletions

View File

@@ -1,6 +1,6 @@
# react-scripts
This package includes scripts and configuration used by [Create React App](https://github.com/facebookincubator/create-react-app).
This package includes scripts and configuration used by [Create React App](https://github.com/facebookincubator/create-react-app).<br>
Please refer to its documentation:
* [Getting Started](https://github.com/facebookincubator/create-react-app/blob/master/README.md#getting-started) How to create a new app.

View File

@@ -175,7 +175,7 @@ You dont have to ever use `eject`. The curated feature set is suitable for sm
## Supported Language Features and Polyfills
This project supports a superset of the latest JavaScript standard.
This project supports a superset of the latest JavaScript standard.<br>
In addition to [ES6](https://github.com/lukehoban/es6features) syntax features, it also supports:
* [Exponentiation Operator](https://github.com/rwaldron/exponentiation-operator) (ES2016).
@@ -402,7 +402,7 @@ Then in `package.json`, add the following lines to `scripts`:
"test": "react-scripts test --env=jsdom",
```
>Note: To use a different preprocessor, replace `build-css` and `watch-css` commands according to your preprocessors documentation.
>Note: To use a different preprocessor, replace `build-css` and `watch-css` commands according to your preprocessors documentation.
Now you can rename `src/App.css` to `src/App.scss` and run `npm run watch-css`. The watcher will find every Sass file in `src` subdirectories, and create a corresponding CSS file next to it, in our case overwriting `src/App.css`. Since `src/App.js` still imports `src/App.css`, the styles become a part of your application. You can now edit `src/App.scss`, and `src/App.css` will be regenerated.
@@ -1355,10 +1355,10 @@ You can find instructions in [Deploying React with Zero Configuration](https://b
Sometimes `npm run build` works locally but fails during deploy via Heroku with an error like this:
```
```
remote: Failed to create a production build. Reason:
remote: Module not found: Error: Cannot resolve 'file' or 'directory'
MyDirectory in /tmp/build_1234/src
MyDirectory in /tmp/build_1234/src
```
This means you need to ensure that the lettercase of the file or directory you `import` matches the one you see on your filesystem or on GitHub.
@@ -1452,6 +1452,7 @@ If this doesnt happen, try one of the following workarounds:
* Some editors like Vim and IntelliJ have a “safe write” feature that currently breaks the watcher. You will need to disable it. Follow the instructions in [“Working with editors supporting safe write”](https://webpack.github.io/docs/webpack-dev-server.html#working-with-editors-ides-supporting-safe-write).
* If your project path contains parentheses, try moving the project to a path without them. This is caused by a [Webpack watcher bug](https://github.com/webpack/watchpack/issues/42).
* On Linux and macOS, you might need to [tweak system settings](https://webpack.github.io/docs/troubleshooting.html#not-enough-watchers) to allow more watchers.
* If the project runs inside a virtual machine such as (a Vagrant provisioned) VirtualBox, run `npm install --save-dev cross-env` in its root folder and then replace `"react-scripts start"` in the `scripts` section of its `package.json` with `"cross-env CHOKIDAR_USEPOLLING=true react-scripts start"`. This ensures that the next time you run `npm start`, the watcher uses the polling mode, as necessary inside a VM.
If none of these solutions help please leave a comment [in this thread](https://github.com/facebookincubator/create-react-app/issues/659).