[CSS] stylelint に prefers-color-scheme を注意されたくない

stylelint で CSS をチェックしていると、モダンブラウザが対応して一般的に使われている機能でも仕様や草案の定義に含まれないものはエラーになる。
分かってやってるから気にしないという対応もあるが、エラー表示にドキッとしちゃう人は個別に許可してもらおう。

ダークモードに適用させる @media のカラースキーム判定は便利。

@media screen and (prefers-color-scheme: dark) {
︙
}

だがこれが、環境によりそんな機能名知らないって怒られるので .stylelintrc.json の "rules" に検査オプションを設定する。

[.stylelintrc.json]

{
	"extends": ["***"],
	"rules": {
		"media-feature-name-no-unknown": [
			true,
			{
				"ignoreMediaFeatureNames": [
					"prefers-color-scheme"
				]
			}
		],
	}
}

"media-feature-name-no-unknown" : true
@media の不明な機能名をチェックする。

"ignoreMediaFeatureNames" : []
二次オプションのリストで特定の機能名をチェックから除外する。
正規表現が使えるので ["/^custom-/"] と追加すれば custom- から始まる custom-name や custom-size を除外する。
複数追加するときはカンマ区切り。

怒られるかどうかは extends で指定した検査要綱による。
保守のために外部から受け取ったファイルでは未対応の物もあった。

参考リンク

media-feature-name-no-unknown | Stylelint