🎨

stylelintをv13からv16にアップデート

2024/05/17に公開

BeforeAfter

    "stylelint": "^13.13.1",
    "stylelint-config-prettier": "^8.0.2",
    "stylelint-config-recess-order": "^2.6.0",
    "stylelint-config-standard": "^22.0.0",
    "stylelint-prettier": "^1.2.0",
    "stylelint-scss": "^3.21.0",
    "lint-staged": ">=11",
    "stylelint": "^16.5.0",
    "stylelint-config-recess-order": "^5.0.1",
    "stylelint-config-standard-scss": "^13.1.0",
    "stylelint-scss": "^6.3.0",
    "postcss": "^8.4.38",
    "lint-staged": "^15.2.2",

v14

https://stylelint.io/migration-guide/to-14

デフォルトでscssはlintできなくなった

stylelint-config-standard-scssを導入
stylelint-config-standardも含まれているので削除

https://github.com/stylelint-scss/stylelint-config-standard-scss

yarn stylelintできない

TypeError: Class extends value undefined is not a constructor or null

postcssv7を見ちゃう?ので上位側にpostcssv8を導入

https://stackoverflow.com/questions/72272219/stylelint-gives-error-class-extends-value-undefined-is-not-a-constructor-or-nul

https://github.com/stylelint-scss/stylelint-config-standard-scss/issues/5

kebab-case以外エラーになるのでその辺りのルール追加

参考:https://flex-box.net/stylelint-v14/#co-index-2

v15

https://stylelint.io/migration-guide/to-15

スタイル関連のルールが含まれなくなった

stylelint-config-prettierとstylelint-prettierを削除

https://github.com/prettier/stylelint-prettier?tab=readme-ov-file#disabling-rules-that-may-conflict-with-prettier

https://github.com/prettier/stylelint-config-prettier

v16

https://stylelint.io/migration-guide/to-16

特に変更なくてOKだった

Discussion