web-dev-qa-db-ja.com

コンパスとサスの違いは？

これは一種のばかげた質問だと知っていますが、Googleを検索していて、答えが見つかりません：/では、SASSとCompass、SASSとSCSSの違いは何ですか？私はこれに本当に混乱しています。

情報をありがとう:)

sasscompass-sass
50
Junxuan Ng

過度に単純化するリスクがありますが、Compassはフレームワークであり、Sassは言語の抽象化です。 Compassコンテキスト内でSassコードを記述します（そしてそれを標準のCSSにコンパイルします）。 SCSSは、単にSass言語の最新の構文です。私の知る限り、構文がCSSに似ているという唯一の目的で作成されました。 Sassのすべての構文糖衣構文ですが、CSSに慣れているフロントエンド開発者にはより馴染みがあります。

80
Rob Wilkerson

一般的に：「Sass」はcssプリプロセッサの名前です-意味：開発者が通常のcssコードに自動的にコンパイルされる短い形式のプレースホルダーを書くための便利なツール。 Sassには、短い形式のコードを記述する2つの異なる方法があります。SCSSとSASSです。 SCSSとSASSの違いは非常に単純です。SCSSは追加機能を備えた通常のCSSです。すべてのCSSファイルは.scssに名前を変更でき、検証されます。 SASSは、中括弧をすべてスキップすることにより、短い形式の書き込みを使用します。 .cssファイルを有効な.sassファイルに変換するには、cssコードを変更する必要があります。

Compassは、コマンドラインツールを介して制御されるいわゆるcssフレームワークです。 Compassは、事前定義された関数やミックスインなどを提供することで開発をサポートし、コーディングを高速化し、書き込みミスを防ぎます。たとえば、コンパスでは、「@ include box-shadow（）;」と記述するだけで、すべてのポリフィルを含むボックスシャドウを呼び出すことができます。すべてのcss-codeは、「compasscompile」を使用してファイルをコンパイルするときにコンパス自体によって追加されます。 Compassは、より大規模なフロントエンド開発プロジェクトで作業するために最も使用されるツールの1つです。

20
RedSight

私はTLDRの答えを提供しました：

Compassは本質的にSASSライブラリです。 sassの生の言語を使用し、一般的な再利用可能な関数を作成します。

ウェブサイト から：

CompassはSassを使用します。

SassはCSS3の拡張であり、ネストされたルール、変数、ミックスイン、セレクターの継承などを追加します。 Sassは適切にフォーマットされたCSSを生成し、スタイルシートの整理と保守を容易にします。

14
chrisjlee

Compassは、Sassで構築されたフレームワークです。もう1つの人気のあるSassフレームワークは Bourbon と Susy です。つまり、これらのフレームワークはすべてSassで記述されています。ワークフローを高速化するために使用できる定義済みの関数とミックスインがあります。

SCSS（Sassy Sass）は、Sassの新しい構文です。 CSS構文を使用します。例えば：

h2 {
  color: red;
}

一方、Sassはそれほど「厳密ではない」構文を使用します。

h2 
  color: red

中括弧やセミコロンは使用されていないことに注意してください。また、インデントを使用する必要があります。

要約すると、どのフレームワークまたはどのSass構文を使用するかは、あなたの選択です！

7
fmuser