Learn Vue JS course Learn Javascript and Vue JS Learn VueJS course Learn VueJS Tutorial

Master Vue.js with Vue School Premium

$25 / month

Single File Components

Get access to this course, 17 others, and future Vue.js courses!

Start Learning

Already got an account? Log in

Using CSS Pre-Processors with Single File Components

Vue-cli makes it very easy for us to use pre-processors like Pug, Less, Stylus, or Sass with our Single File Components.

In this lesson, we’ll learn how to use SCSS (Sassy CSS) in our Single File Components.

Install sass-loader and node-sass

yarn add sass-loader node-sass
# OR
npm install sass-loader node-sass

Remember to restart your development server after installing new node modules

yarn serve
# OR
npm run serve