Commit a1b56cf8 authored by Michael Wayman's avatar Michael Wayman Committed by Joe Haddad
Browse files

Update README.md CSS Preprocessor --> node-sass-chokidar alternative (#1987)

* resolves facebookincubator/create-react-app#1986 updates CSS Preprocessor docs to include information on node-sass-chokidar alternative to node-sass

* Update README.md
parent a53f22b7
3 merge requests!12191Lim.Pisey.168:/Identified - We are currently investigating reports of missing build logs. The issue has been identified and a resolution is in progress. We will provide a further update when available.Mar 21, 09:02 UTC,!12853brikk,!5717Automatically extract project file structure from build bundle file
Showing with 20 additions and 0 deletions
+20 -0
...@@ -468,6 +468,26 @@ Then we can change `start` and `build` scripts to include the CSS preprocessor c ...@@ -468,6 +468,26 @@ Then we can change `start` and `build` scripts to include the CSS preprocessor c
Now running `npm start` and `npm run build` also builds Sass files. Note that `node-sass` seems to have an [issue recognizing newly created files on some systems](https://github.com/sass/node-sass/issues/1891) so you might need to restart the watcher when you create a file until it’s resolved. Now running `npm start` and `npm run build` also builds Sass files. Note that `node-sass` seems to have an [issue recognizing newly created files on some systems](https://github.com/sass/node-sass/issues/1891) so you might need to restart the watcher when you create a file until it’s resolved.
**Performance Note**
`node-sass --watch` has been reported to have *performance issues* in certain conditions when used in a virtual machine or with docker. If you are experiencing high CPU usage with node-sass you can alternatively try [node-sass-chokidar](https://www.npmjs.com/package/node-sass-chokidar) which uses a different file-watcher. Usage remains the same, simply replace `node-sass` with `node-sass-chokidar`:
```
npm uninstall node-sass --save-dev
npm install node-sass-chokidar --save-dev
```
And in your scripts:
```diff
"scripts": {
- "build-css": "node-sass src/ -o src/",
- "watch-css": "npm run build-css && node-sass src/ -o src/ --watch --recursive"
+ "build-css": "node-sass-chokidar src/ -o src/",
+ "watch-css": "npm run build-css && node-sass-chokidar src/ -o src/ --watch --recursive"
}
```
## Adding Images, Fonts, and Files ## Adding Images, Fonts, and Files
With Webpack, using static assets like images and fonts works similarly to CSS. With Webpack, using static assets like images and fonts works similarly to CSS.
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment