0

私はちょうど Sass を学んでおり、@import を使用しています。私は次の状況を持っています...

_master.scss <-- これには、色などのすべてのグローバル変数が含まれます

_child1.scss <-- これは私の子ページの 1 つですが、マスターからのものを必要とします

_child2.scss <-- これは他の私の子ページの 1 つですが、マスターからのものも必要です

問題は、_master がかなり大きくなっていることです。そのため、Visual Studio 2012 で Mindscape ツールを使用して Scss ファイル (子) を保存すると、生成された css ファイルに両方の子のマスター ファイルからのすべての css が含まれていることに気付きました。

基本的に、「@import」を使用してマスター ファイルを参照するたびに css が重複してしまい、パフォーマンスが低下します。これを回避する方法はありますか？

4

2 に答える 2

0

このスニペットを使用してコンテンツをインポートすることで、この重複した SCSS を解決しました。

// src/main/scss/import-once-workaround.scss
$imported-once-files: () !default;

@function not-imported($name) {
  $imported-once-files: $imported-once-files !global;
  $module_index: index($imported-once-files, $name);
  @if (($module_index == null) or ($module_index == false)) {
    $imported-once-files: append($imported-once-files, $name);
    @return true;
  }
  @return false;
}

ファイルのインポートは、次の方法で行われます。

@if not-imported("font") { @import "font"; }

私は、 Zurbの代わりにこのアプローチを使用して StyleDocco を機能させました。

于 2015-06-11T05:39:26.520 に答える