andrew-rayco
9/15/2017 - 12:36 AM

Watch CSS setup with node-sass and nodemon

Watch CSS setup with node-sass and nodemon

Watch CSS setup with node-sass and nodemon

npm install --save-dev node-sass nodemon

Add the following scripts to package.json

Build CSS

"build-css": "node-sass -o css css" 

// Where the first 'css' is the destination directory for compiled output.

// Second 'css' is the source folder with sass/scss files

// -o is shorthand for --output

e.g. "build-css": "node-sass --output [destination-directory-for-output] [sass-source-file-directory]"

Watch CSS

"watch-css": "nodemon -e sass -x \"npm run build-css\""

// Where the '-e sass' tells nodemon to monitor files with that extension. Shorthand for '--ext'

// (e.g. 'nodemon -e sass,scss' will watch both types of sass files and restart on changes)

// The '-x' (shorthand for '--exec') will execute the following script