概要
表題のとおりです。
StylelintとPrettierを併用する設定にした際、
設定を間違えると、Stylelint が Prettierの書き換えた内容にOKを出さずに、
永遠にエラーが出続ける状態になるので注意が必要です。
Stylelintの設定をPrettierに合わせる
たいていは、Stylelintの設定のextendsには、
stylelint-config-standardやstylelint-config-recommendを指定するように解説されています。
しかしこれらの設定は、Prettierが行う自動形成にそぐわない形でルールが設定されているので、
Prettier用のstylelint-config-prettierをextendsに設定する必要があります。
手順
1. stylelint-config-prettierをインストール
プロジェクトのルートディレクトリで、以下のコマンドを実行しstylelint-config-prettierをインストールします。
yarn add -D stylelint-config-prettier
2. Stylelintの設定ファイルを書き換えます。
設定ファイル .stylelintrc の extendsの値を書き換えます。
{
"extends": "stylelint-config-prettier"
}
以上で、設定は完了です。
最後に
この点には本当にやられました。
何度、Stylelintのルールに沿うように修正しても、
Prettierが書き換えるので、エラーが永遠に出続けていました。
コミットにフックして、自動でLintがかかる設定にしていたので、
永遠にコミットができない状態でしたが、なんとか解決できてよかったです。
ご指摘がございましたら、ぜひともコメント・修正依頼を頂ければと思います。
ご質問には分かる範囲でお答えいたします。