@import 'compass'にはフレームワーク全体が含まれていますか？

Question

変数とミックスインのような共有されたものを1つの場所、つまりcssマニフェストファイルにインポートし始めました。今、私はいくつかのCompassミックスインをファイルへのダイレクトパスを使ってインポートしています。

私の質問は、@import 'compass'がフレームワーク全体をapplication.cssに挿入するのか、それともsassファイルの参照を参照して必要なミックスインだけを読み込むことで行われますか？

私はすべてを含めたくありません。

Answer 1

the docs@import 'compass'によると、CSS3、Typography and Utilitiesモジュールがインポートされます。これらのモジュールは出力CSSに何も注入しません。ミックスインだけを含んでいます。

特定のモジュールまたはサブモジュール（つまり@import 'compass/css3/image'）にインポートを制限すると、SASSファイルをCSSにコンパイルするのに必要な時間が短縮されます。

---

たとえば、2つのファイルを作成できます。

// all.scss 

@import "compass"; 

.candy { 
    @include background(linear-gradient(top left, #333, #0c0)); 
} 

// module.scss 

@import "compass/css3/images"; 

.candy { 
    @include background(linear-gradient(top left, #333, #0c0)); 
} 

我々は彼ら（compass compile sass/FILENAME.scss）をコンパイルする場合、結果のCSSは同じになります。

.candy { 
    background: -webkit-gradient(linear, 0% 0%, 100% 100%, color-stop(0%, #333333), color-stop(100%, #00cc00)); 
    background: -webkit-linear-gradient(top left, #333333, #00cc00); 
    background: -moz-linear-gradient(top left, #333333, #00cc00); 
    background: -o-linear-gradient(top left, #333333, #00cc00); 
    background: linear-gradient(top left, #333333, #00cc00); 
} 

は、今コンパイルコマンドに--time引数を追加して、結果を比較することができます。私のマシンでは、all.cssをコンパイルするのに1.516秒かかり、module.cssに対して0.108秒しかかかりませんでした。