Skip to Content
Learn
Your First Sass Stylesheet
Compiling Sass

Sass can’t be directly interpreted by your browser, so it must first be converted, or compiled, to CSS before the browser can directly understand it.

Compiling refers to converting code to lower level code so that it can be executed. By compiling SCSS to CSS, it can be interpreted by your browser and the results will appear on a webpage.

Before we dive into writing Sass, let’s first learn how to compile it to CSS by typing the following command in the terminal and pressing enter:

sass main.scss main.css

The sass command above takes in two arguments:

  1. The input (main.scss)
  2. The location of where to place that output (main.css)

Make sure to look closely at the extensions of each file in the command above.

Instructions

1.

In the terminal, compile the SCSS to CSS by typing the following command and hitting Enter on your keyboard:

sass main.scss main.css

Compare the output in main.css to the input in main.scss.

2.

From this point on, any Sass code you write will be auto-compiled anytime you click the “Run” button. This will allow us to focus strictly on writing code.

Even though you won’t be compiling the code manually everytime you write Sass in this course, be aware that it’s happening for you in the background.

Folder Icon

Sign up to start coding

Already have an account?