CSS はグローバルにやるのかローカルにやるのか

はてな匿名ダイアリー

2019-11-29

■CSS はグローバルにやるのかローカルにやるのか

この辺、よくわからない...

FLOCSSは知らなかったけど、その質問、かなりどうでも良い枝葉末節なような・・・そもそもコンポーネントは文脈によって用例が1000ぐらいある用語だし、巻き上げはES6/TSではそもそも文法でチェック対象。CSSをどう構造化するかもチームの意思決定とか次第だし、CSS in JSの方が良い。 https://t.co/Y14qF4NzpQ— 渋川よしき (@shibu_jp) May 3, 2019

vueはあくまでjsだからね。
jsはjsで管理した方がいいし、cssはcssで管理した方がいい。
でないと確実に肥大化する。
css 設計さえしとけばコンポーネントファイルになんて書く必要ないしね。
CSS 設計使えない現場ならコンポーネント内でやった方がいいけど。 https://t.co/8jGzRGXlD8— かずきち@プログラミングスクール経営者 (@kazukichi3110) November 28, 2019

渋川様は、どちらかというとウェブアプリケーションよりで、ウェブカツ!! 様は、どちらかというとウェブ制作よりだから意見の相違が見られるのかな。以下が、自分にとっての答えっぽいな...

CSS 設計わかんないよーって方は、まず「borderより外側のスタイルをコンポーネントに含めない」を意識するといいかも！

// Bad
.list .box {
margin-bottom: 10px;
border: ...;
padding: ...;
}

// Better
.box {
border: ...;
padding: ...;
}

.list .box {
margin-bottom: 10px;
}— ダーシノ / NES.css (@bc_rikko) December 6, 2019