0

I have a website project with the main folder on my desktop with a Css folder inside is the style.css

and have installed Sass in Visual Studio Code Have Windows 10 operating system with node sass for windows running with npm

Sass file structure architecture has one file for each part of the website with a _base.scss file for color variable and font variables etc. And a main.scss file for the @imports

my index style sheet

 <link rel="stylesheet" href="css/style.css">

within the Main Sass folder in my VSC project I now see a css-style.css sitting there with the other individual .scss files. Is this correct?

json file

 "watch:sass": "node-sass sass/main.scss css/style.css -w",
"devserver": "live-server --browser=firefox",
"start": "npm-run-all --parallel devserver watch:sass",
"compile:sass": "node-sass sass/main.scss css/style.comp.css",
"prefix:css": "postcss --use autoprefixer -b 'last 10 versions' css/style.comp.css -o css/style.prefix.css",
"compress:css": "node-sass css/style.prefix.css css/style.css output-style compressed",
"build": "npm-run-all compile:sass prefix:css compress:css"

index file is

<link rel="stylesheet" href="css/style.css">
Kevvn
  • 3
  • 5

2 Answers2

1

You can define a path for your style.css. Basically you can do this:

sass your/path/to/style.scss your/path/to/style.css

If you execute the sass command in your sass folder, it will create a ".css" in this folder.

Maybe you find help in this guide -> https://sass-lang.com/guide

soDub
  • 158
  • 7
  • since i'm new what do you recommend be best way – Kevvn Dec 16 '19 at 16:23
  • in your case you need to use "node-sass" in your command line. There is also a nice description with node-sass -> https://stackoverflow.com/questions/31448114/how-to-compile-or-convert-sass-scss-to-css-with-node-sass-no-ruby – soDub Dec 16 '19 at 16:26
  • ok thanks will check it out i also showed the json file settings and css linking from index if you get chance to see – Kevvn Dec 16 '19 at 16:31
  • I can't help you with your config, but i can help you to do this from command line. If your sass and css folder are in your root project directory you can try this command: "node-sass sass/main.scss css/style.css". This should compile all imports from main.scss to your style.css – soDub Dec 16 '19 at 16:42
  • Looks like problem is solved as I deleted the css-style.css file! Thank you for your help – Kevvn Dec 16 '19 at 16:46
0

no its not generate automatically unless you set in with tools like gulp or adjust it with your IDE tools also you can use third-party software like http://koala-app.com/ on windows for generate css file automatically

Shahryar Mohajer
  • 581
  • 3
  • 11
  • what do you recommend I do with it now delete the file? Looks like it has imput from the main scss file – Kevvn Dec 16 '19 at 16:00