WordPress勉強中

最新情報NEWS

stylelint導入

stylelint導入してみました。
これは便利ですね。コードがキレイに書けるようになります。
複数人で作業してもstylelintが勝手にプロパティー順に並べてくれるし、エラー出してここ直してねって教えてくれます。

yarn add --dev stylelint stylelint-scss stylelint-config-standard
yarn add --dev stylelint-config-property-sort-order-smacss

stylelint-config-property-sort-order-smacss
cssプロパティを自動ソートしてくれます。
scssファイルにプロパティー順を気にして書かなくてもよくなります。


module.exports = {
  plugins: ["stylelint-scss"],
  extends: [
    "stylelint-config-standard",
    "stylelint-config-property-sort-order-smacss"
  ],
  ignoreFiles: ["**/node_modules/**", "src/scss/vendor/**"],
  rules: {
    indentation: 2,
    "scss/selector-no-union-class-name": true,
    "at-rule-no-unknown": null,
    "scss/at-rule-no-unknown": true,
    "font-family-no-missing-generic-family-keyword": null
  }
};

ルールで追加したところは、
"scss/selector-no-union-class-name": true,
&__elementの書き方禁止

"at-rule-no-unknown": null,
"scss/at-rule-no-unknown": true,
sassの@ルールでエラーを出さない

"font-family-no-missing-generic-family-keyword": null
font-familyにserif・sans-serifとかの総称ファミリを指定してねを無効

変数でfont-family指定してるので無効にしました。

https://github.com/syun730/development_dartsass/commit/342910f2e0af21cd53f72fb716697054a33ad7ba

stylelint-alt
stylelint-キャプション

コメント投稿フォーム

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

CAPTCHA


PAGE TOP