彼らが !default を付けない理由 / Bourbon / Neat / Bitters
ThoughtBot がメンテナンスしてる有名なCSS関係のプロジェクト。
Bourbon / Neat / Bitters、あと Refills てのもあるけど、必要なのは最初の3つかな。
サービス作ってて、バックエンドはあらかたできたなーーー、
フロントどうするかなーってなった時に、
Bootstrap のようなライブラリ使うか、スクラッチでやるか迷うんだけど、
最近というか、しばらくライブラリを使わないことが多い気がする。
大して機能を使わないしね。ふんだんに使いこなすような巨大なサイトはいきなりできないし。
とはいっても、ほんとにほんとに最初からつくるのもダルい。
そこでこの3兄弟。
Bourbon / Neat / Bitters
Bourbon - A Lightweight Sass Tool Set
- Bourbon は便利なミックスインが最小限で入っていて、
- Neat はグリッドシステムに特化したCSSクラスが定義されていたり。
- Bitters はというとサクっと見た目を整えてくれる感じ。
でこの Bitters の扱いにちょっと困ってまして…。
通常ライブラリはアップデートのこともあるので、
中身を触らずに他のファイルで上書きすると思うのですが、Bitters はそれができない。
Sassの値に !default
付いてないからね。
あとで変数上書きしたところで反映されないのです。
!default
についてはこちらで ↓
A SASS !default use case
なんでそんなことになってるのかと調べてたら、
1年も前に議論されてましたとさ…。
Allow for default variables to be overridden. by cwest · Pull Request #32 · thoughtbot/bitters
scss
1
2
3
4
5
6
7
$blue: #477dca;
$action-color: $blue;
// - - - 別ファイルで読み込み ↓ - - - //
//もちろん$action-colorの色は変わらない
$blue: #eee;
これを下のようにしようとのPR。
scss
1
2
3
4
5
6
7
$blue: #eee;
// 先に定義しちゃえば上書きできる
// - - - 別ファイルで読み込み ↑ - - - //
$blue: #477dca !default;
$action-color: $blue;
!default
は何にも値が見つからなかったらこれ使えよってフラグです。
みんなが !default
つけろつけろ!と言う中、
粘り強く主張する中の人いいですね。
何かと言うと、
Bitters は Scaffold であってライブラリでもフレームワークでもないよという事。
プロジェクトの進行に合わせてどんどん書き換えるべき。
Override でなくて Overwrite らしい。
新しいバージョンの Bitters が出ても気にすんな!そのまま突っ走れ!という感じ。
!default
を付けないのはみんなが Bitters をライブラリとして使うのを応援したくないから。
理由は、
- ウェブデザインは1つ1つオリジナリティがあるのだから専用のCSSが出来るはず
- 旧バージョンとの互換性は保証したくないし、する意味がない(上の理由により)
thoughtbot のチームだからこそと勝手に思ってます。
Bootstrap で似たようなサイトばっかりつくってんじゃねー と言ってるのかなw
それではー
参考
Announcing Bitters, a Dash of Sass Stylesheets for Bourbon and Neat