What is Grunt ?
Minify every CSS file within a folder
Combine and Minify CSS files
Run two scripts together
Less is a CSS Preprocessor. http://lesscss.org/
$ npm install -g less
lessc style.less > style.css
'lessc' is not recognized as an internal or external command, operable program or batch file.
node C:\Folder\Name\node_modules\less\bin\lessc style.less > style.css
Note : \Folder\Name should be the folder in which the node_modules have been installed.
SASS is a CSS Preprocessor. http://sass-lang.com/
gem install sass
Note : gems is a package manager for Ruby.
3. Check if sass got installed
4. on a dedicated "test" folder , create two folders "scss" and "css"
5. In the Terminal or Command Prompt
--watch command is used to constantly monitor style.scss file for any changes and compile it as soon any change happens.
C:\test> sass --watch scss:css
sass --watch scss:css
To watch dedicated file style.scss and style.css
sass --watch style.scss:style.css
style.scss is the main file
style.css is the complied file
sass --watch scss:css --style compressed
Image Source : Pexels