The article is about how to :

(i) install SASS on local computer

(ii) compile it in our machine both manually and automatically using command line & NPM

Step-1:

To install SASS in our computer first we’ve to download & install Node.js.

After installing , to check if Node is perfectly installed, run the following code in command prompt[for windows] or terminal [for mac].

node -v

If version is showed like above then node is perfectly installed.

Now open the directory of your project in your command, where you wanna use SASS.

Then run the following code in your command to install SASS in the desired project.

npm init

Now edit accordingly. A package.json file will be created in the project directory.

Step-2:

Now run this in the command

npm install node-sass --save-dev

This will install SASS in your project directory successfully.

Now to compile SASS file to CSS file in your machine,

Open the package.json file.

Change the script tag of the file to the following code

"scripts": {
    "compile:sass": "node-sass the-file-that-needs-to-be-compiled  the-output-file -w"
  },

For me it’s :

"scripts": {
    "compile:sass": "node-sass sass/main.scss css/style.css -w"
  },

Here I want to compile the main.scss file which is in the sass/main.scss directory. And I want it to be stored in style.css file after the compilation which is in the css/style.css directory.

Now run the following code in command.[In the project directory]

npm run compile:sass

This will keep compiling the SCSS code to CSS whenever a change is made in the SCSS file.

N.B. : Remember to keep the command running. Don’t close the terminal or command prompt.

Now to automate the compilation. Open a new command

Run the following code in the new command:

For Windows :

npm install live-server -g

For Mac:

sudo npm install live-server -g

This will install live server globally in your machine.

Step-3:

Now again open a new command. Go to your project directory

run the following code:

live-server

This will create a local host and the changes will be compiled instantly.

N.B. : Don’t close any commands.Otherwise it will not work.

If all the packages are pre installed , following only STEP-3 will do the work.