В чем разница между SCSS и Sass?

Question

Из того, что я читал, Sass - это язык, который делает CSS более мощным благодаря поддержке переменных и математики.

В чем разница с SCSS?Это должен быть один и тот же язык?Аналогичный?Различный

Answer 1

Разница между статьями SASS и SCSS объясняет разницу в деталях.Не смущайтесь вариантами SASS и SCSS, хотя я тоже был изначально, .scss - это Sassy CSS и следующее поколение .sass.

Если это не имело смысла, вы можете увидеть разницув коде ниже.

/* SCSS */
$blue: #3bbfce;
$margin: 16px;

.content-navigation {
  border-color: $blue;
  color: darken($blue, 9%);
}

.border {
  padding: $margin / 2; margin: $margin / 2; border-color: $blue;
}

В коде выше мы используем;отделить декларации.Я даже добавил все объявления для .border в одну строку, чтобы проиллюстрировать этот момент дальше.Напротив, приведенный ниже код SASS должен быть на разных строках с отступом, и в нем нет смысла.

/* SASS */
$blue: #3bbfce
$margin: 16px

.content-navigation
  border-color: $blue
  color: darken($blue, 9%)

.border
  padding: $margin / 2
  margin: $margin / 2
  border-color: $blue

Из CSS ниже видно, что стиль SCSS намного больше похож на обычныйCSS, чем старый подход SASS.

/* CSS */
.content-navigation {
  border-color: #3bbfce;
  color: #2b9eab;
}

.border {
  padding: 8px;
  margin: 8px;
  border-color: #3bbfce;
}

Я думаю, что в наши дни большую часть времени, если кто-то упоминает, что он работает с Sass, он ссылается на авторизацию в .scss, а не на традиционный способ .sass.

Answer 2

Компактный ответ:

SCSS относится к основному синтаксису, поддерживаемому препроцессором Sass CSS .

• Файлы, заканчивающиеся на .scss, представляют стандартный синтаксис, поддерживаемый Sass. SCSS - это расширенный набор CSS.
• Файлы, оканчивающиеся на .sass, представляют собой «более старый» синтаксис, поддерживаемый Sass, созданный в мире ruby.