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

Single File Components

Get access to the most comprehensive Vue.js video library in the world. Over 300 video lessons including the newest Vue 3 features.

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