-

---

3. SASS'ni o'rnatib olish

1

3. SASS'ni o'rnatib olish

Reja:

SASS compiler

Install Sass

There are a good many applications that will get you up and running with Sass in a few minutes for Mac, Windows, and Linux. You can 

download most of the applications for free but a few of them are paid apps (and totally worth it).

https://sass-lang.com/install

SASS kompilyatorlar

Dart SASS - SASS'ning asosiy kompilyatori bo'lib, tezda yangilanib turiladi va omma tomonidan qo'llab 

quvvatlanadi. Ishlash bo'yicha eng tezi

Node SASS - LibSass ya'ni C yordamida yozilgan kompilyatorni o'rab turuvchi (wrapper) hisoblanadi. Tezligi 

bo'yicha Dart SASS'dan keyingi o'rinda turadi

Dart SASS JS - Dart SASS'ning JS ko'rinishi. Tepadagilardan sekin hisoblanadi

VSCode extensions orqali

---

3. SASS'ni o'rnatib olish

2

Live Sass Compiler

Live Sass Compiler - Visual Studio Marketplace

If you found any bug or if you have any suggestion, feel free to report or suggest me.] A 

VSCode Extension that help you to compile/transpile your SASS/SCSS files to CSS files at 

realtime with live browser reload.

https://marketplace.visualstudio.com/items?itemName=ritwickdey.live-sass

Compile Hero

Sass/Less/Stylus/Pug/Jade/Typescript/Javascript Compile Hero Pro - Visual Studio Marketplace

Extension for Visual Studio Code - 

🚀

Easy to compile ts, tsx, scss, less, stylus, jade, pug and es6 on save 

without using a build task.

https://marketplace.visualstudio.com/items?itemName=Wscats.eno

$font-stack:    Helvetica, sans-serif; 

$primary-color: #333; 

 

body { 

  font: 100% $font-stack; 

  color: $primary-color; 

}

NPM orqali

💡

NPM orqali SASS'ni o'rnatib olish uchun birinchi operatsion tizimimizga Node.js'ni o'rnatib olishimiz 

talab qilinadi

Node.js

Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine.

https://nodejs.org/en/

npm install -g sass

SASS kompilyator (compiler) orqali SASS kodimizni CSS'ga o'tkazib olish

$font-stack:    Helvetica, sans-serif; 

$primary-color: #333; 

 

body { 

  font: 100% $font-stack; 

  color: $primary-color; 

}

sass file.scss file.css

---

3. SASS'ni o'rnatib olish

3

body { 

  font: 100% Helvetica, sans-serif; 

  color: #333; 

}

💡

Har safar faylda o'zgarish bo'lganida qayda kompilyatsiya qilish uchun yuqoridagi buyruqga 

(command) --watch argumentini qo'shib yozish kerak bo'ladi

sass file.scss file.css --watch