Sass

ファイル分割

Sass では@import <file-path>;といいう構文で別の sass ファイルを取り込むことができます。

例えば、以下のような_base.scssindex.scssがあるとします。

// _base.scss

$font-size: 14px;
// index.scss
@import 'base';

body {
  color: $font-size;
}

最初に@import '_base';とすることでindex.scssでも_base.scssの内容が使えるようになります。baseで読み込んでいるのは入力ミスではなくそういう仕様で、別ファイルに読み込まれることを想定しているようなファイルは_をファイル名に付けるとディレクトリ構造が整えれます。