How to Use SCSS in Vue.js CLI Project
If we forget to select any CSS preprocessors at the time of creating CLI Vue app, we can add later easily. Today I’m going to show how to enable SCSS in our Vue project.
Table of Contents
Install CSS preprocessor dependencies using this command:
npm install --save-dev node-sass sass-loader
Use in Component
Inside our application components, we can use like:
<style lang="scss"> // your styles </style>
Use in External File
We can write our SCSS styles in separate file. After that we just need to import the file in component like:
<script> import '../css/style.scss' // </script>
That’s it. Thanks for reading.
Md Obydullah is a software engineer and full stack developer specialist at Laravel, Django, Vue.js, Node.js, Android, Linux Server, and Ethichal Hacking.