Posts

Showing posts with the label Gulp

Setup vscode to work with sass effortlessly

Image
Setup vscode to work with sass effortlessly Writing sass is very easy with code. Today we will see how we can leverage some NPM packages to compile SASS to CSS, watch file changes and live update the browser for an effortless style development. This post will be composed by 3 parts: 1. Setup vscode task 2. Create a Gulp build script 3. Use live-server for live reload The tasks are from the example of vscode documentation to compile sass https://code.visualstudio.com/docs/languages/css#_transpiling-sass-and-less-into-css . 1. Setup vscode task To use code tasks, we need to create a tasks.json file under the hidden /.vscode folder. | - .vscode - tasks.json | - style.scss | - index.html The tasks allow us to execute programs by selecting from the search bar CMD + shift + P , Run build task . If a default task is set, it can directly be triggered by CMD + shift + B . As a first example we can start by installing the sass compiler with node-sass . npm install -g node-sas...