StyleLintの導入手順まとめ

StyleLintの導入したときの手順をまとめる

yarn add

yarn add --dev stylelint stylelint-scss stylelint-config-standard

設定ファイル

プロジェクト直下の内容のファイルを置く

.stylelintrc.json

{
  "plugins": [
    "stylelint-scss"
  ],
   "extends": "stylelint-config-standard"
}

StyleLintの実行

Railsで app/frontend/stylesheetsにscssファイルを配置するときの例
--fixオプションは可能なものは自動修正するオプション

以下の様にpackge.jsonのscriptsに追加して
yarn run lint:stylesheetで実行

package.json

...
  "scripts": {
    "lint:stylesheet": "stylelint --fix app/frontend/stylesheets/**/*.scss"
  },
...