LightningのCSSは「追加CSS」と「CSSカスタマイズ」どっち?
LightningのCSSカスタム方法は2種類
追加CSS
外観 > カスタマイズ

STEP
1
追加CSS

STEP
2
画面左側にCSSを追加

STEP
3
ExUnit CSSカスタマイズ
ExUnit > CSSカスタマイズ

STEP
1
画面中央にCSSを追記

STEP
2
比較してみた
| 項目 | 外観 追加CSS | ExUnit CSSカスタマイズ |
|---|---|---|
| 入力画面 | × 狭い | ◎ 広い |
| プレビュー | ◎ あり | × なし |
| 行番号の表示 | ◎ あり | × なし |
| 検索機能 | ◎ あり | × なし |
| 予測変換 | ◎ あり | × なし |
| ソースコード表記 | × header内に記載 改行あり | ▲ header内に記載 改行なし |
| サイト表示への影響 | ◎ 長いコードを記載しても 影響なし | × 長いコードを記載すると 重くなり、403になることもある |
入力画面
外観
追加CSS

画面の1/3程度のサイズ編集する為、改行が多くなり見づらいが、プレビューしながら編集できるメリットもある。
ExUnit
CSSカスタマイズ

画面全体に編集画面が表示されるので編集しやすいが、
プレビューがないのはデメリットに感じる。
行の表示
外観
追加CSS

編集時に行番号(Line Number)が表示され、文字の色も変わる為、エディターに近い感覚で編集できる。
※スペースの表記がないため、全角スペースが入る入力トラブルが起こる。
ExUnit
CSSカスタマイズ

画面全体に編集画面が表示されるので編集しやすい
