stylelintユーザガイドーコマンドラインインターフェース(CLI)
内容の目的
本内容は、Stylelintユーザガイドーコマンドラインインターフェース(CLI) を翻訳し、個人活用のために整理しています。
コマンドラインインターフェース(CLI)
Stylelint はコマンドラインから利用できます。例:
npx stylelint "**/*.css"
ファイルグロブには必ず引用符を付けてください。
npm スクリプトを使用する場合は、引用符をエスケープする必要があります:
{
"scripts": {
"lint": "stylelint \"**/*.css\""
}
}
npx stylelint --help
を使用すると CLI のドキュメントを表示できます。
オプション
CLI では以下のオプションが利用できます:
--allow-empty-input, --aei
グロブパターンがファイルに一致しない場合でもエラーを出さずに終了します。詳細はこちら。
--cache-location
キャッシュの保存先となるファイルまたはディレクトリのパス。詳細はこちら。
--cache-strategy
変更ファイル検出のためにキャッシュで使用する戦略。"metadata" または "content" のいずれかを指定できます。詳細はこちら。
--cache
処理したファイルの結果をキャッシュし、Stylelint は変更されたファイルのみを再検査します。デフォルトではキャッシュは process.cwd()
の ./.stylelintcache
に保存されます。詳細はこちら。
--color, --no-color
カラー出力の強制有効化/無効化。
--config-basedir
"extends"、"plugins"、"customSyntax" で指定された相対パスが基準とするディレクトリの絶対パス。これらの値が相対パスの場合のみ必要です。詳細はこちら。
--config, -c
設定オブジェクトを含む JSON、YAML、または JS ファイルのパス。詳細はこちら。
--custom-syntax
コードに適用するカスタム構文を指定します。詳細はこちら。
--disable-default-ignores, --di
デフォルトの無視設定を無効化します。Stylelint は node_modules
の内容を自動的に無視しなくなります。詳細はこちら。
--fix
ルールにより報告された問題を可能な限り自動修正します。詳細はこちら。
--compute-edit-info, --cei
修正可能な問題に対する編集情報を計算します。詳細はこちら。
--formatter, -f
| --custom-formatter
結果を整形するフォーマッターを指定します。詳細はこちら。
--globbyOptions, --go
globby に渡す JSON 形式のオプション。詳細はこちら。
--ignore-disables, --id
stylelint-disable
(例: /* stylelint-disable block-no-empty */
)コメントを無視します。詳細はこちら。
--ignore-path, -i
無視するファイルを記述したパターンを含むファイルのパス。パスは絶対パスまたは process.cwd()
からの相対パスで指定できます。このオプションは複数回指定可能です。デフォルトでは Stylelint は process.cwd()
の .stylelintignore
を参照します。詳細はこちら。
--ignore-pattern, --ip
(.stylelintignore
に加えて)無視するファイルのパターン。
--max-warnings, --mw
許容する警告の最大数を設定します。詳細はこちら。
--output-file, -o
レポートを書き込むファイルのパス。Stylelint は指定した filename
に加え process.stderr
にもレポートを出力します。
--print-config
指定した入力パスに対する設定を表示します。グロブはサポートされていません。
--quiet, -q
重大度が "error" のルールのみを問題として登録します("warning" レベルは無視されます)。詳細はこちら。
--quiet-deprecation-warnings
非推奨警告を無視します。詳細はこちら。
--report-descriptionless-disables, --rdd
説明のない stylelint-disable
コメントのレポートを生成します。詳細はこちら。
--report-invalid-scope-disables, --risd
設定オブジェクトに存在しないルールに使われている stylelint-disable
コメントのレポートを生成します。詳細はこちら。
--report-needless-disables, --rd
不要な stylelint-disable
コメントを洗い出し、必要なものだけを残すためのレポートを生成します。詳細はこちら。
--report-unscoped-disables, --rud
1つ以上のルールにスコープされていない設定コメントのレポートを生成します。詳細はこちら。
--stdin-filename
入力に割り当てるファイル名。詳細はこちら。
--stdin
空でも stdin 入力を受け付けます。
--validate, --no-validate
ルールのオプション検証を強制的に有効/無効にします。詳細はこちら。
--version, -v
現在インストールされている Stylelint のバージョンを表示します。
ルールごとのパフォーマンス計測
TIMING
環境変数を利用することで、各ルールのパフォーマンスをプロファイリングできます。
TIMING
を all
または正の整数(n >= 1
)に設定すると、リント処理完了時に最も実行時間の長かったルールの処理時間が表示されます。これには各ルールの生成・実行時間および全体に対する割合も含まれます。
$ TIMING=10 npx stylelint "**/*.css"
╔════╤════════════════════════════════════════════════════╤═══════════╤══════════╗
║ # │ Rule │ Time (ms) │ Relative ║
╟────┼────────────────────────────────────────────────────┼───────────┼──────────╢
║ 1 │ no-descending-specificity │ 1.154 │ 19.3% ║
╟────┼────────────────────────────────────────────────────┼───────────┼──────────╢
║ 2 │ no-duplicate-selectors │ 0.357 │ 6.0% ║
╟────┼────────────────────────────────────────────────────┼───────────┼──────────╢
║ 3 │ length-zero-no-unit │ 0.300 │ 5.0% ║
╟────┼────────────────────────────────────────────────────┼───────────┼──────────╢
║ 4 │ selector-type-no-unknown │ 0.265 │ 4.4% ║
╟────┼────────────────────────────────────────────────────┼───────────┼──────────╢
║ 5 │ alpha-value-notation │ 0.251 │ 4.2% ║
╟────┼────────────────────────────────────────────────────┼───────────┼──────────╢
║ 6 │ declaration-block-no-redundant-longhand-properties │ 0.217 │ 3.6% ║
╟────┼────────────────────────────────────────────────────┼───────────┼──────────╢
║ 7 │ selector-class-pattern │ 0.187 │ 3.1% ║
╟────┼────────────────────────────────────────────────────┼───────────┼──────────╢
║ 8 │ value-keyword-case │ 0.151 │ 2.5% ║
╟────┼────────────────────────────────────────────────────┼───────────┼──────────╢
║ 9 │ declaration-block-no-duplicate-custom-properties │ 0.146 │ 2.4% ║
╟────┼────────────────────────────────────────────────────┼───────────┼──────────╢
║ 10 │ declaration-empty-line-before │ 0.140 │ 2.3% ║
╚════╧════════════════════════════════════════════════════╧═══════════╧══════════╝
TIMING
の値を変更することで表示件数を調整できます。
例:
-
TIMING=30
にすると上位 30 件のルールが表示されます。 -
TIMING=all
ですべてのルールが表示されます。
使用例
CLI は ファイルグロブ または process.stdin
を入力として受け付けます。整形された結果は process.stderr
に出力されます。
ファイルグロブには必ず引用符を付けてください。
例 A - 再帰的な検査
foo
ディレクトリ内のすべての .css
ファイルを再帰的に検査します:
stylelint "foo/**/*.css"
例 B - 複数拡張子の検査
すべての .css
、.scss
、.sass
ファイルを検査します:
stylelint "**/*.{css,scss,sass}"
例 C - 標準入力(stdin)の検査
stdin
を検査します:
echo "a { color: pink; }" | stylelint
例 D - 除外パターンの利用
入力グロブで否定を使い、docker
サブフォルダ内を除くすべての .css
ファイルを検査します:
stylelint "**/*.css" "!**/docker/**"
例 E - キャッシュの利用
foo
ディレクトリ内の .scss
ファイルをキャッシュしながら検査します:
stylelint "foo/**/*.scss" --cache --cache-location "/Users/user/.stylelintcache/"
例 F - レポートファイルへの出力
foo
ディレクトリ内のすべての .css
ファイルを検査し、出力を myTestReport.txt
に書き込みます:
stylelint "foo/*.css" --output-file myTestReport.txt
例 G - 設定ファイルの指定
bar/mySpecialConfig.json
を設定として、foo
ディレクトリおよびそのサブディレクトリ内のすべての .css
ファイルを検査します:
stylelint "foo/**/*.css" --config bar/mySpecialConfig.json
例 H - カスタム構文の利用
foo
ディレクトリ内のすべての .css
ファイルをカスタム構文で再帰的に検査します:
stylelint "foo/**/*.css" --custom-syntax path/to/my-custom-syntax.js
例 I - 成功時にも出力
成功時にも出力を表示する:
stylelint -f verbose "foo/**/*.css"
例 J - 設定内容の表示
指定した入力ファイルで使用される設定を表示します:
stylelint test.css --print-config
例 K - レポートを他コマンドへパイプ
レポートをパイプで他のコマンドの入力として利用します:
stylelint -f json "*.css" 2>&1 | jq '[.[] | .warnings | length] | add'
終了コード
CLI は下記の終了コードでプロセスを終了します:
-
1
- 致命的なエラー -
2
- リント問題 -
64
- CLI の無効な使い方 -
78
- 無効な設定ファイル
Discussion