DEV Community

loading...
Cover image for Setting up SASS

Setting up SASS

nashmeyah profile image Nashmeyah ・1 min read

Hey Guys and Gals!

Currently I am working on a little somethin' somethin' and for the first time I had to start using Sass! So, of course I thought of writing a blog on setting up.

  1. Set up a package.json file so that you can alter Sass settings.

    npm init

  2. Install Sass

    npm install node-sass

Inside the package.json file, (on windows) press ctrl+f and search sass, there you will find it as part of the packages installed.

  1. VS Code Extension or npm.

Here you will have to decide whether you want to install the extension on your VS Code then run sass server which you can find it by typing Live Sass Compiler in the extensions and install it. On the lower right hand side, you can click watch sass and that will start the server. Or, you can alter the package.json file and run the sass through the terminal.

locate this in the package.json file,

"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
Enter fullscreen mode Exit fullscreen mode

change "test" to "sass" and add the following,

"scripts": {
"sass": "node-sass -w scss/ -o css/ --recursive"
},
Enter fullscreen mode Exit fullscreen mode

now you can run the sass script through your terminal by typing this command

npm run sass
Enter fullscreen mode Exit fullscreen mode

Discussion (0)

pic
Editor guide