Add SASS documentation
Created by: tsironis
Adding SASS (or Less) support in a project bootstrapped using create-react-app, doesn't require any advanced modifications. It's seems more intimidating than it actually is. We don't even have to eject.
First, install preprocessor of your choice. SASS seems the most popular weapon of choice at the moment, so we'll use it as an example:
npm install node-sass --save-dev
Then in package.json
just add the following lines:
"scripts": {
...
"build-css": "node-sass src/sass/base.scss src/index.css",
"watch-css": "node-sass src/sass/base.scss src/index.css -w",
...
}
and run them alongside main scripts, by adding npm run watch-css &
to start
script and npm run build-css &&
to build
.
"scripts": {
"start": "npm run watch-css & react-scripts start",
"build": "npm run build-css && react-scripts build",
"build-css": "node-sass src/sass/base.scss src/index.css",
"watch-css": "node-sass src/sass/base.scss src/index.css -w",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject"
}
As far as I'm concerned, that works using Less as well.
Is that something that would belong in current documentation?