From d7d29988992c4cb2a4e197178dbedcafe99719f4 Mon Sep 17 00:00:00 2001 From: Patrick Taylor Date: Fri, 2 Aug 2024 17:37:30 +0100 Subject: [PATCH 01/11] =?UTF-8?q?Install=20stylelint=20plugins=20?= =?UTF-8?q?=F0=9F=96=8D=EF=B8=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package.json | 16 ++++- yarn.lock | 194 +++++++++++++++++++++++++++++++++++++++++++++++++++ 2 files changed, 208 insertions(+), 2 deletions(-) diff --git a/package.json b/package.json index 73add78..d6c1e8f 100644 --- a/package.json +++ b/package.json @@ -21,6 +21,7 @@ "test": "jest" }, "dependencies": { + "@stylistic/stylelint-plugin": "3.0.0", "chalk": "5.3.0", "chokidar": "3.6.0", "commander": "12.1.0", @@ -39,7 +40,12 @@ "markdownlint-rule-helpers": "0.25.0", "node-notifier": "10.0.1", "space-log": "1.2.0", - "stylelint": "16.6.1" + "stylelint": "16.6.1", + "stylelint-config-property-sort-order-smacss": "10.0.0", + "stylelint-config-standard-scss": "13.1.0", + "stylelint-declaration-strict-value": "1.10.6", + "stylelint-order": "6.0.4", + "stylelint-scss": "6.4.1" }, "devDependencies": { "@babel/core": "7.24.6", @@ -65,6 +71,7 @@ }, "author": "Patrick Taylor ", "keywords": [ + "@stylistic/stylelint-plugin", "eslint", "eslint-plugin-eslint-comments", "eslint-plugin-inclusive-language", @@ -76,6 +83,11 @@ "eslint-plugin-sort-exports", "lint", "markdownlint", - "stylelint" + "stylelint", + "stylelint-config-property-sort-order-smacss", + "stylelint-config-standard-scss", + "stylelint-declaration-strict-value", + "stylelint-order", + "stylelint-scss" ] } diff --git a/yarn.lock b/yarn.lock index 6cbf1ff..f7debf7 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1038,16 +1038,31 @@ resolved "https://registry.yarnpkg.com/@csstools/css-parser-algorithms/-/css-parser-algorithms-2.6.3.tgz#b5e7eb2bd2a42e968ef61484f1490a8a4148a8eb" integrity sha512-xI/tL2zxzEbESvnSxwFgwvy5HS00oCXxL4MLs6HUiDcYfwowsoQaABKxUElp1ARITrINzBnsECOc1q0eg2GOrA== +"@csstools/css-parser-algorithms@^2.7.1": + version "2.7.1" + resolved "https://registry.yarnpkg.com/@csstools/css-parser-algorithms/-/css-parser-algorithms-2.7.1.tgz#6d93a8f7d8aeb7cd9ed0868f946e46f021b6aa70" + integrity sha512-2SJS42gxmACHgikc1WGesXLIT8d/q2l0UFM7TaEeIzdFCE/FPMtTiizcPGGJtlPo2xuQzY09OhrLTzRxqJqwGw== + "@csstools/css-tokenizer@^2.3.1": version "2.3.1" resolved "https://registry.yarnpkg.com/@csstools/css-tokenizer/-/css-tokenizer-2.3.1.tgz#3d47e101ad48d815a4bdce8159fb5764f087f17a" integrity sha512-iMNHTyxLbBlWIfGtabT157LH9DUx9X8+Y3oymFEuMj8HNc+rpE3dPFGFgHjpKfjeFDjLjYIAIhXPGvS2lKxL9g== +"@csstools/css-tokenizer@^2.4.1": + version "2.4.1" + resolved "https://registry.yarnpkg.com/@csstools/css-tokenizer/-/css-tokenizer-2.4.1.tgz#1d8b2e200197cf5f35ceb07ca2dade31f3a00ae8" + integrity sha512-eQ9DIktFJBhGjioABJRtUucoWR2mwllurfnM8LuNGAqX3ViZXaUchqk+1s7jjtkFiT9ySdACsFEA3etErkALUg== + "@csstools/media-query-list-parser@^2.1.11": version "2.1.11" resolved "https://registry.yarnpkg.com/@csstools/media-query-list-parser/-/media-query-list-parser-2.1.11.tgz#465aa42f268599729350e305e1ae14a30c1daf51" integrity sha512-uox5MVhvNHqitPP+SynrB1o8oPxPMt2JLgp5ghJOWf54WGQ5OKu47efne49r1SWqs3wRP8xSWjnO9MBKxhB1dA== +"@csstools/media-query-list-parser@^2.1.13": + version "2.1.13" + resolved "https://registry.yarnpkg.com/@csstools/media-query-list-parser/-/media-query-list-parser-2.1.13.tgz#f00be93f6bede07c14ddf51a168ad2748e4fe9e5" + integrity sha512-XaHr+16KRU9Gf8XLi3q8kDlI18d5vzKSKCY510Vrtc9iNR0NJzbY9hhTmwhzYZj/ZwGL4VmB3TA9hJW0Um2qFA== + "@csstools/selector-specificity@^3.1.1": version "3.1.1" resolved "https://registry.yarnpkg.com/@csstools/selector-specificity/-/selector-specificity-3.1.1.tgz#63085d2995ca0f0e55aa8b8a07d69bfd48b844fe" @@ -1664,6 +1679,20 @@ dependencies: "@sinonjs/commons" "^3.0.0" +"@stylistic/stylelint-plugin@3.0.0": + version "3.0.0" + resolved "https://registry.yarnpkg.com/@stylistic/stylelint-plugin/-/stylelint-plugin-3.0.0.tgz#38b97fea1fd4f4268afaf55621b3fa08d0a199ca" + integrity sha512-GymY+9CSqkPaZ1A3m3w/tvCdpP3qQcaL1FSaoVv9aKL3Tn6GVJWHc2VWVkbNEsYr4QImHjWnlmVZROwgUEjMmQ== + dependencies: + "@csstools/css-parser-algorithms" "^2.7.1" + "@csstools/css-tokenizer" "^2.4.1" + "@csstools/media-query-list-parser" "^2.1.13" + is-plain-object "^5.0.0" + postcss-selector-parser "^6.1.1" + postcss-value-parser "^4.2.0" + style-search "^0.1.0" + stylelint "^16.8.0" + "@tsconfig/node10@^1.0.7": version "1.0.11" resolved "https://registry.yarnpkg.com/@tsconfig/node10/-/node10-1.0.11.tgz#6ee46400685f130e278128c7b38b7e031ff5b2f2" @@ -2345,6 +2374,11 @@ css-functions-list@^3.2.2: resolved "https://registry.yarnpkg.com/css-functions-list/-/css-functions-list-3.2.2.tgz#9a54c6dd8416ed25c1079cd88234e927526c1922" integrity sha512-c+N0v6wbKVxTu5gOBBFkr9BEdBWaqqjQeiJ8QvSRIJOf+UxlJh930m8e6/WNeODIK0mYLFkoONrnj16i2EcvfQ== +css-property-sort-order-smacss@~2.2.0: + version "2.2.0" + resolved "https://registry.yarnpkg.com/css-property-sort-order-smacss/-/css-property-sort-order-smacss-2.2.0.tgz#c2cb4741e5580fe2f6d968ccde0946e8b689033c" + integrity sha512-nXutswsivIEBOrPo/OZw2KQjFPLvtg68aovJf6Kqrm3L6FmTvvFPaeDrk83hh0+pRJGuP3PeKJwMS0E6DFipdQ== + css-tree@^2.3.1: version "2.3.1" resolved "https://registry.yarnpkg.com/css-tree/-/css-tree-2.3.1.tgz#10264ce1e5442e8572fc82fbe490644ff54b5c20" @@ -2365,6 +2399,13 @@ debug@^4.1.0, debug@^4.1.1, debug@^4.3.1, debug@^4.3.2, debug@^4.3.4: dependencies: ms "2.1.2" +debug@^4.3.6: + version "4.3.6" + resolved "https://registry.yarnpkg.com/debug/-/debug-4.3.6.tgz#2ab2c38fbaffebf8aa95fdfe6d88438c7a13c52b" + integrity sha512-O/09Bd4Z1fBrU4VzkhFqVgpPzaGbw6Sm9FEkBT1A/YBXQFGuuSxa1dN2nxgxS34JmKXqYx8CZAwEVoJFImUXIg== + dependencies: + ms "2.1.2" + dedent@^1.0.0: version "1.5.3" resolved "https://registry.yarnpkg.com/dedent/-/dedent-1.5.3.tgz#99aee19eb9bae55a67327717b6e848d0bf777e5a" @@ -3665,6 +3706,11 @@ known-css-properties@^0.31.0: resolved "https://registry.yarnpkg.com/known-css-properties/-/known-css-properties-0.31.0.tgz#5c8d9d8777b3ca09482b2397f6a241e5d69a1023" integrity sha512-sBPIUGTNF0czz0mwGGUoKKJC8Q7On1GPbCSFPfyEsfHb2DyBG0Y4QtV+EVWpINSaiGKZblDNuF5AezxSgOhesQ== +known-css-properties@^0.34.0: + version "0.34.0" + resolved "https://registry.yarnpkg.com/known-css-properties/-/known-css-properties-0.34.0.tgz#ccd7e9f4388302231b3f174a8b1d5b1f7b576cea" + integrity sha512-tBECoUqNFbyAY4RrbqsBQqDFpGXAEbdD5QKr8kACx3+rnArmuuR22nKQWKazvp07N9yjTyDZaw/20UIH8tL9DQ== + leven@^3.1.0: version "3.1.0" resolved "https://registry.yarnpkg.com/leven/-/leven-3.1.0.tgz#77891de834064cccba82ae7842bb6b14a13ed7f2" @@ -4097,16 +4143,31 @@ pkg-dir@^4.2.0: dependencies: find-up "^4.0.0" +postcss-media-query-parser@^0.2.3: + version "0.2.3" + resolved "https://registry.yarnpkg.com/postcss-media-query-parser/-/postcss-media-query-parser-0.2.3.tgz#27b39c6f4d94f81b1a73b8f76351c609e5cef244" + integrity sha512-3sOlxmbKcSHMjlUXQZKQ06jOswE7oVkXPxmZdoB1r5l0q6gTFTQSHxNxOrCccElbW7dxNytifNEo8qidX2Vsig== + postcss-resolve-nested-selector@^0.1.1: version "0.1.1" resolved "https://registry.yarnpkg.com/postcss-resolve-nested-selector/-/postcss-resolve-nested-selector-0.1.1.tgz#29ccbc7c37dedfac304e9fff0bf1596b3f6a0e4e" integrity sha512-HvExULSwLqHLgUy1rl3ANIqCsvMS0WHss2UOsXhXnQaZ9VCc2oBvIpXrl00IUFT5ZDITME0o6oiXeiHr2SAIfw== +postcss-resolve-nested-selector@^0.1.4: + version "0.1.4" + resolved "https://registry.yarnpkg.com/postcss-resolve-nested-selector/-/postcss-resolve-nested-selector-0.1.4.tgz#0068767902fb40f0e6cd7b24faee4fa4bc14a5da" + integrity sha512-R6vHqZWgVnTAPq0C+xjyHfEZqfIYboCBVSy24MjxEDm+tIh1BU4O6o7DP7AA7kHzf136d+Qc5duI4tlpHjixDw== + postcss-safe-parser@^7.0.0: version "7.0.0" resolved "https://registry.yarnpkg.com/postcss-safe-parser/-/postcss-safe-parser-7.0.0.tgz#6273d4e5149e286db5a45bc6cf6eafcad464014a" integrity sha512-ovehqRNVCpuFzbXoTb4qLtyzK3xn3t/CUBxOs8LsnQjQrShaB4lKiHoVqY8ANaC0hBMHq5QVWk77rwGklFUDrg== +postcss-scss@^4.0.9: + version "4.0.9" + resolved "https://registry.yarnpkg.com/postcss-scss/-/postcss-scss-4.0.9.tgz#a03c773cd4c9623cb04ce142a52afcec74806685" + integrity sha512-AjKOeiwAitL/MXxQW2DliT28EKukvvbEWx3LBmJIRN8KfBGZbRTxNYW0kSqi1COiTZ57nZ9NW06S6ux//N1c9A== + postcss-selector-parser@^6.1.0: version "6.1.0" resolved "https://registry.yarnpkg.com/postcss-selector-parser/-/postcss-selector-parser-6.1.0.tgz#49694cb4e7c649299fea510a29fa6577104bcf53" @@ -4115,11 +4176,33 @@ postcss-selector-parser@^6.1.0: cssesc "^3.0.0" util-deprecate "^1.0.2" +postcss-selector-parser@^6.1.1: + version "6.1.1" + resolved "https://registry.yarnpkg.com/postcss-selector-parser/-/postcss-selector-parser-6.1.1.tgz#5be94b277b8955904476a2400260002ce6c56e38" + integrity sha512-b4dlw/9V8A71rLIDsSwVmak9z2DuBUB7CA1/wSdelNEzqsjoSPeADTWNO09lpH49Diy3/JIZ2bSPB1dI3LJCHg== + dependencies: + cssesc "^3.0.0" + util-deprecate "^1.0.2" + +postcss-sorting@^8.0.2: + version "8.0.2" + resolved "https://registry.yarnpkg.com/postcss-sorting/-/postcss-sorting-8.0.2.tgz#6393385ece272baf74bee9820fb1b58098e4eeca" + integrity sha512-M9dkSrmU00t/jK7rF6BZSZauA5MAaBW4i5EnJXspMwt4iqTh/L9j6fgMnbElEOfyRyfLfVbIHj/R52zHzAPe1Q== + postcss-value-parser@^4.2.0: version "4.2.0" resolved "https://registry.yarnpkg.com/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz#723c09920836ba6d3e5af019f92bc0971c02e514" integrity sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ== +postcss@^8.4.32, postcss@^8.4.40: + version "8.4.40" + resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.4.40.tgz#eb81f2a4dd7668ed869a6db25999e02e9ad909d8" + integrity sha512-YF2kKIUzAofPMpfH6hOi2cGnv/HrUlfucspc7pDyvv7kGdqXrfj8SCl/t8owkEgKEuu8ZcRjSOxFxVLqwChZ2Q== + dependencies: + nanoid "^3.3.7" + picocolors "^1.0.1" + source-map-js "^1.2.0" + postcss@^8.4.38: version "8.4.38" resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.4.38.tgz#b387d533baf2054288e337066d81c6bee9db9e0e" @@ -4522,6 +4605,72 @@ strip-json-comments@^3.1.1: resolved "https://registry.yarnpkg.com/strip-json-comments/-/strip-json-comments-3.1.1.tgz#31f1281b3832630434831c310c01cccda8cbe006" integrity sha512-6fPc+R4ihwqP6N/aIv2f1gMH8lOVtWQHoqC4yK6oSDVVocumAsfCqjkXnqiYMhmMwS/mEHLp7Vehlt3ql6lEig== +style-search@^0.1.0: + version "0.1.0" + resolved "https://registry.yarnpkg.com/style-search/-/style-search-0.1.0.tgz#7958c793e47e32e07d2b5cafe5c0bf8e12e77902" + integrity sha512-Dj1Okke1C3uKKwQcetra4jSuk0DqbzbYtXipzFlFMZtowbF1x7BKJwB9AayVMyFARvU8EDrZdcax4At/452cAg== + +stylelint-config-property-sort-order-smacss@10.0.0: + version "10.0.0" + resolved "https://registry.yarnpkg.com/stylelint-config-property-sort-order-smacss/-/stylelint-config-property-sort-order-smacss-10.0.0.tgz#cc230a577ac9e4f8b0cca1659110874874002c89" + integrity sha512-NuiTgyqD8UdYY1IpTBIodBbrWKwaib5r8sq5kGHQ52UrmT8O7Fa8ZWYGipSZw6k9tGoljl9Hng2jtH+wBTMa1Q== + dependencies: + css-property-sort-order-smacss "~2.2.0" + stylelint-order "^6.0.4" + +stylelint-config-recommended-scss@^14.0.0: + version "14.1.0" + resolved "https://registry.yarnpkg.com/stylelint-config-recommended-scss/-/stylelint-config-recommended-scss-14.1.0.tgz#1a5855655cddcb5f77c10f38c76567adf2bb9aa3" + integrity sha512-bhaMhh1u5dQqSsf6ri2GVWWQW5iUjBYgcHkh7SgDDn92ijoItC/cfO/W+fpXshgTQWhwFkP1rVcewcv4jaftRg== + dependencies: + postcss-scss "^4.0.9" + stylelint-config-recommended "^14.0.1" + stylelint-scss "^6.4.0" + +stylelint-config-recommended@^14.0.1: + version "14.0.1" + resolved "https://registry.yarnpkg.com/stylelint-config-recommended/-/stylelint-config-recommended-14.0.1.tgz#d25e86409aaf79ee6c6085c2c14b33c7e23c90c6" + integrity sha512-bLvc1WOz/14aPImu/cufKAZYfXs/A/owZfSMZ4N+16WGXLoX5lOir53M6odBxvhgmgdxCVnNySJmZKx73T93cg== + +stylelint-config-standard-scss@13.1.0: + version "13.1.0" + resolved "https://registry.yarnpkg.com/stylelint-config-standard-scss/-/stylelint-config-standard-scss-13.1.0.tgz#2be36ca13087325a42c1f26df8267808667cc886" + integrity sha512-Eo5w7/XvwGHWkeGLtdm2FZLOMYoZl1omP2/jgFCXyl2x5yNz7/8vv4Tj6slHvMSSUNTaGoam/GAZ0ZhukvalfA== + dependencies: + stylelint-config-recommended-scss "^14.0.0" + stylelint-config-standard "^36.0.0" + +stylelint-config-standard@^36.0.0: + version "36.0.1" + resolved "https://registry.yarnpkg.com/stylelint-config-standard/-/stylelint-config-standard-36.0.1.tgz#727cbb2a1ef3e210f5ce8329cde531129f156609" + integrity sha512-8aX8mTzJ6cuO8mmD5yon61CWuIM4UD8Q5aBcWKGSf6kg+EC3uhB+iOywpTK4ca6ZL7B49en8yanOFtUW0qNzyw== + dependencies: + stylelint-config-recommended "^14.0.1" + +stylelint-declaration-strict-value@1.10.6: + version "1.10.6" + resolved "https://registry.yarnpkg.com/stylelint-declaration-strict-value/-/stylelint-declaration-strict-value-1.10.6.tgz#7eb5ffc73cedc03057685c005ebed69911be71fa" + integrity sha512-aZGEW4Ee26Tx4UvpQJbcElVXZ42EleujEByiyKDTT7t83EeSe9t0lAG3OOLJnnvLjz/dQnp+L+3IYTMeQI51vQ== + +stylelint-order@6.0.4, stylelint-order@^6.0.4: + version "6.0.4" + resolved "https://registry.yarnpkg.com/stylelint-order/-/stylelint-order-6.0.4.tgz#3e80d876c61a98d2640de181433686f24284748b" + integrity sha512-0UuKo4+s1hgQ/uAxlYU4h0o0HS4NiQDud0NAUNI0aa8FJdmYHA5ZZTFHiV5FpmE3071e9pZx5j0QpVJW5zOCUA== + dependencies: + postcss "^8.4.32" + postcss-sorting "^8.0.2" + +stylelint-scss@6.4.1, stylelint-scss@^6.4.0: + version "6.4.1" + resolved "https://registry.yarnpkg.com/stylelint-scss/-/stylelint-scss-6.4.1.tgz#78a197bbcdf9a61b7365769a9a42dddc722a24c5" + integrity sha512-+clI2bQC2FPOt06ZwUlXZZ95IO2C5bKTP0GLN1LNQPVvISfSNcgMKv/VTwym1mK9vnqhHbOk8lO4rj4nY7L9pw== + dependencies: + known-css-properties "^0.34.0" + postcss-media-query-parser "^0.2.3" + postcss-resolve-nested-selector "^0.1.1" + postcss-selector-parser "^6.1.0" + postcss-value-parser "^4.2.0" + stylelint@16.6.1: version "16.6.1" resolved "https://registry.yarnpkg.com/stylelint/-/stylelint-16.6.1.tgz#84735aca2bb5cde535572b7a9b878d2ec983a570" @@ -4567,6 +4716,51 @@ stylelint@16.6.1: table "^6.8.2" write-file-atomic "^5.0.1" +stylelint@^16.8.0: + version "16.8.1" + resolved "https://registry.yarnpkg.com/stylelint/-/stylelint-16.8.1.tgz#7d4b2d7922771dd0514446a66f04e954f1dfa444" + integrity sha512-O8aDyfdODSDNz/B3gW2HQ+8kv8pfhSu7ZR7xskQ93+vI6FhKKGUJMQ03Ydu+w3OvXXE0/u4hWU4hCPNOyld+OA== + dependencies: + "@csstools/css-parser-algorithms" "^2.7.1" + "@csstools/css-tokenizer" "^2.4.1" + "@csstools/media-query-list-parser" "^2.1.13" + "@csstools/selector-specificity" "^3.1.1" + "@dual-bundle/import-meta-resolve" "^4.1.0" + balanced-match "^2.0.0" + colord "^2.9.3" + cosmiconfig "^9.0.0" + css-functions-list "^3.2.2" + css-tree "^2.3.1" + debug "^4.3.6" + fast-glob "^3.3.2" + fastest-levenshtein "^1.0.16" + file-entry-cache "^9.0.0" + global-modules "^2.0.0" + globby "^11.1.0" + globjoin "^0.1.4" + html-tags "^3.3.1" + ignore "^5.3.1" + imurmurhash "^0.1.4" + is-plain-object "^5.0.0" + known-css-properties "^0.34.0" + mathml-tag-names "^2.1.3" + meow "^13.2.0" + micromatch "^4.0.7" + normalize-path "^3.0.0" + picocolors "^1.0.1" + postcss "^8.4.40" + postcss-resolve-nested-selector "^0.1.4" + postcss-safe-parser "^7.0.0" + postcss-selector-parser "^6.1.1" + postcss-value-parser "^4.2.0" + resolve-from "^5.0.0" + string-width "^4.2.3" + strip-ansi "^7.1.0" + supports-hyperlinks "^3.0.0" + svg-tags "^1.0.0" + table "^6.8.2" + write-file-atomic "^5.0.1" + supports-color@^5.3.0: version "5.5.0" resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-5.5.0.tgz#e2e69a44ac8772f78a1ec0b35b689df6530efc8f" From 8ec48df568592ebbbb11ab0217fc9aebc303faf6 Mon Sep 17 00:00:00 2001 From: Patrick Taylor Date: Sun, 4 Aug 2024 13:30:17 +0100 Subject: [PATCH 02/11] =?UTF-8?q?Prepare=20files=20for=20stylelint=20rules?= =?UTF-8?q?=20=F0=9F=97=82=EF=B8=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- config/stylelint.config.js | 28 +++++ .../rules/declaration-strict-value.ts | 3 + config/stylelint/rules/index.ts | 15 +++ config/stylelint/rules/order.ts | 3 + config/stylelint/rules/scss.ts | 3 + config/stylelint/rules/stylelint.ts | 3 + config/stylelint/rules/stylistic.ts | 3 + package.json | 4 +- yarn.lock | 112 +----------------- 9 files changed, 61 insertions(+), 113 deletions(-) create mode 100644 config/stylelint.config.js create mode 100644 config/stylelint/rules/declaration-strict-value.ts create mode 100644 config/stylelint/rules/index.ts create mode 100644 config/stylelint/rules/order.ts create mode 100644 config/stylelint/rules/scss.ts create mode 100644 config/stylelint/rules/stylelint.ts create mode 100644 config/stylelint/rules/stylistic.ts diff --git a/config/stylelint.config.js b/config/stylelint.config.js new file mode 100644 index 0000000..3aa78cf --- /dev/null +++ b/config/stylelint.config.js @@ -0,0 +1,28 @@ +import Rules from './stylelint/rules' + +export default () => ({ + extends: [ + 'stylelint-config-property-sort-order-smacss', + ], + overrides: [{ + files: ['**/*.scss'], // TODO: Extend and make dry + rules: { + 'at-rule-no-unknown': null, // scss/at-rule-no-unknown + 'function-no-unknown': null, // scss/function-no-unknown + 'property-no-unknown': null, // scss/property-no-unknown + ...Rules.DeclarationStrictValue, + ...Rules.SCSS, + }, + }], + plugins: [ + '@stylistic/stylelint-plugin', + 'stylelint-declaration-strict-value', + 'stylelint-order', + 'stylelint-scss', + ], + rules: { + ...Rules.Order, + ...Rules.Stylelint, + ...Rules.Stylistic, + }, +}) diff --git a/config/stylelint/rules/declaration-strict-value.ts b/config/stylelint/rules/declaration-strict-value.ts new file mode 100644 index 0000000..9ad2ee1 --- /dev/null +++ b/config/stylelint/rules/declaration-strict-value.ts @@ -0,0 +1,3 @@ +// https://github.com/AndyOGo/stylelint-declaration-strict-value + +export default {} diff --git a/config/stylelint/rules/index.ts b/config/stylelint/rules/index.ts new file mode 100644 index 0000000..dc3c87f --- /dev/null +++ b/config/stylelint/rules/index.ts @@ -0,0 +1,15 @@ +import DeclarationStrictValue from './declaration-strict-value' +import Order from './order' +import SCSS from './scss' +import Stylelint from './stylelint' +import Stylistic from './stylistic' + +const Rules = { + DeclarationStrictValue, + Order, + SCSS, + Stylelint, + Stylistic, +} + +export default Rules diff --git a/config/stylelint/rules/order.ts b/config/stylelint/rules/order.ts new file mode 100644 index 0000000..1de7286 --- /dev/null +++ b/config/stylelint/rules/order.ts @@ -0,0 +1,3 @@ +// https://github.com/hudochenkov/stylelint-order/tree/master + +export default {} diff --git a/config/stylelint/rules/scss.ts b/config/stylelint/rules/scss.ts new file mode 100644 index 0000000..9471886 --- /dev/null +++ b/config/stylelint/rules/scss.ts @@ -0,0 +1,3 @@ +// https://github.com/stylelint-scss/stylelint-scss + +export default {} diff --git a/config/stylelint/rules/stylelint.ts b/config/stylelint/rules/stylelint.ts new file mode 100644 index 0000000..385f4b6 --- /dev/null +++ b/config/stylelint/rules/stylelint.ts @@ -0,0 +1,3 @@ +// https://stylelint.io/user-guide/rules + +export default {} diff --git a/config/stylelint/rules/stylistic.ts b/config/stylelint/rules/stylistic.ts new file mode 100644 index 0000000..26caf7a --- /dev/null +++ b/config/stylelint/rules/stylistic.ts @@ -0,0 +1,3 @@ +// https://github.com/stylelint-stylistic/stylelint-stylistic + +export default {} diff --git a/package.json b/package.json index d6c1e8f..9756817 100644 --- a/package.json +++ b/package.json @@ -40,9 +40,8 @@ "markdownlint-rule-helpers": "0.25.0", "node-notifier": "10.0.1", "space-log": "1.2.0", - "stylelint": "16.6.1", + "stylelint": "16.8.1", "stylelint-config-property-sort-order-smacss": "10.0.0", - "stylelint-config-standard-scss": "13.1.0", "stylelint-declaration-strict-value": "1.10.6", "stylelint-order": "6.0.4", "stylelint-scss": "6.4.1" @@ -85,7 +84,6 @@ "markdownlint", "stylelint", "stylelint-config-property-sort-order-smacss", - "stylelint-config-standard-scss", "stylelint-declaration-strict-value", "stylelint-order", "stylelint-scss" diff --git a/yarn.lock b/yarn.lock index f7debf7..e876d06 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1033,31 +1033,16 @@ dependencies: "@jridgewell/trace-mapping" "0.3.9" -"@csstools/css-parser-algorithms@^2.6.3": - version "2.6.3" - resolved "https://registry.yarnpkg.com/@csstools/css-parser-algorithms/-/css-parser-algorithms-2.6.3.tgz#b5e7eb2bd2a42e968ef61484f1490a8a4148a8eb" - integrity sha512-xI/tL2zxzEbESvnSxwFgwvy5HS00oCXxL4MLs6HUiDcYfwowsoQaABKxUElp1ARITrINzBnsECOc1q0eg2GOrA== - "@csstools/css-parser-algorithms@^2.7.1": version "2.7.1" resolved "https://registry.yarnpkg.com/@csstools/css-parser-algorithms/-/css-parser-algorithms-2.7.1.tgz#6d93a8f7d8aeb7cd9ed0868f946e46f021b6aa70" integrity sha512-2SJS42gxmACHgikc1WGesXLIT8d/q2l0UFM7TaEeIzdFCE/FPMtTiizcPGGJtlPo2xuQzY09OhrLTzRxqJqwGw== -"@csstools/css-tokenizer@^2.3.1": - version "2.3.1" - resolved "https://registry.yarnpkg.com/@csstools/css-tokenizer/-/css-tokenizer-2.3.1.tgz#3d47e101ad48d815a4bdce8159fb5764f087f17a" - integrity sha512-iMNHTyxLbBlWIfGtabT157LH9DUx9X8+Y3oymFEuMj8HNc+rpE3dPFGFgHjpKfjeFDjLjYIAIhXPGvS2lKxL9g== - "@csstools/css-tokenizer@^2.4.1": version "2.4.1" resolved "https://registry.yarnpkg.com/@csstools/css-tokenizer/-/css-tokenizer-2.4.1.tgz#1d8b2e200197cf5f35ceb07ca2dade31f3a00ae8" integrity sha512-eQ9DIktFJBhGjioABJRtUucoWR2mwllurfnM8LuNGAqX3ViZXaUchqk+1s7jjtkFiT9ySdACsFEA3etErkALUg== -"@csstools/media-query-list-parser@^2.1.11": - version "2.1.11" - resolved "https://registry.yarnpkg.com/@csstools/media-query-list-parser/-/media-query-list-parser-2.1.11.tgz#465aa42f268599729350e305e1ae14a30c1daf51" - integrity sha512-uox5MVhvNHqitPP+SynrB1o8oPxPMt2JLgp5ghJOWf54WGQ5OKu47efne49r1SWqs3wRP8xSWjnO9MBKxhB1dA== - "@csstools/media-query-list-parser@^2.1.13": version "2.1.13" resolved "https://registry.yarnpkg.com/@csstools/media-query-list-parser/-/media-query-list-parser-2.1.13.tgz#f00be93f6bede07c14ddf51a168ad2748e4fe9e5" @@ -3701,11 +3686,6 @@ kleur@^3.0.3: resolved "https://registry.yarnpkg.com/kleur/-/kleur-3.0.3.tgz#a79c9ecc86ee1ce3fa6206d1216c501f147fc07e" integrity sha512-eTIzlVOSUR+JxdDFepEYcBMtZ9Qqdef+rnzWdRZuMbOywu5tO2w2N7rqjoANZ5k9vywhL6Br1VRjUIgTQx4E8w== -known-css-properties@^0.31.0: - version "0.31.0" - resolved "https://registry.yarnpkg.com/known-css-properties/-/known-css-properties-0.31.0.tgz#5c8d9d8777b3ca09482b2397f6a241e5d69a1023" - integrity sha512-sBPIUGTNF0czz0mwGGUoKKJC8Q7On1GPbCSFPfyEsfHb2DyBG0Y4QtV+EVWpINSaiGKZblDNuF5AezxSgOhesQ== - known-css-properties@^0.34.0: version "0.34.0" resolved "https://registry.yarnpkg.com/known-css-properties/-/known-css-properties-0.34.0.tgz#ccd7e9f4388302231b3f174a8b1d5b1f7b576cea" @@ -4163,11 +4143,6 @@ postcss-safe-parser@^7.0.0: resolved "https://registry.yarnpkg.com/postcss-safe-parser/-/postcss-safe-parser-7.0.0.tgz#6273d4e5149e286db5a45bc6cf6eafcad464014a" integrity sha512-ovehqRNVCpuFzbXoTb4qLtyzK3xn3t/CUBxOs8LsnQjQrShaB4lKiHoVqY8ANaC0hBMHq5QVWk77rwGklFUDrg== -postcss-scss@^4.0.9: - version "4.0.9" - resolved "https://registry.yarnpkg.com/postcss-scss/-/postcss-scss-4.0.9.tgz#a03c773cd4c9623cb04ce142a52afcec74806685" - integrity sha512-AjKOeiwAitL/MXxQW2DliT28EKukvvbEWx3LBmJIRN8KfBGZbRTxNYW0kSqi1COiTZ57nZ9NW06S6ux//N1c9A== - postcss-selector-parser@^6.1.0: version "6.1.0" resolved "https://registry.yarnpkg.com/postcss-selector-parser/-/postcss-selector-parser-6.1.0.tgz#49694cb4e7c649299fea510a29fa6577104bcf53" @@ -4203,15 +4178,6 @@ postcss@^8.4.32, postcss@^8.4.40: picocolors "^1.0.1" source-map-js "^1.2.0" -postcss@^8.4.38: - version "8.4.38" - resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.4.38.tgz#b387d533baf2054288e337066d81c6bee9db9e0e" - integrity sha512-Wglpdk03BSfXkHoQa3b/oulrotAkwrlLDRSOb9D0bN86FdRyE9lppSp33aHNPgBa0JKCoB+drFLZkQoRRYae5A== - dependencies: - nanoid "^3.3.7" - picocolors "^1.0.0" - source-map-js "^1.2.0" - prelude-ls@^1.2.1: version "1.2.1" resolved "https://registry.yarnpkg.com/prelude-ls/-/prelude-ls-1.2.1.tgz#debc6489d7a6e6b0e7611888cec880337d316396" @@ -4618,35 +4584,6 @@ stylelint-config-property-sort-order-smacss@10.0.0: css-property-sort-order-smacss "~2.2.0" stylelint-order "^6.0.4" -stylelint-config-recommended-scss@^14.0.0: - version "14.1.0" - resolved "https://registry.yarnpkg.com/stylelint-config-recommended-scss/-/stylelint-config-recommended-scss-14.1.0.tgz#1a5855655cddcb5f77c10f38c76567adf2bb9aa3" - integrity sha512-bhaMhh1u5dQqSsf6ri2GVWWQW5iUjBYgcHkh7SgDDn92ijoItC/cfO/W+fpXshgTQWhwFkP1rVcewcv4jaftRg== - dependencies: - postcss-scss "^4.0.9" - stylelint-config-recommended "^14.0.1" - stylelint-scss "^6.4.0" - -stylelint-config-recommended@^14.0.1: - version "14.0.1" - resolved "https://registry.yarnpkg.com/stylelint-config-recommended/-/stylelint-config-recommended-14.0.1.tgz#d25e86409aaf79ee6c6085c2c14b33c7e23c90c6" - integrity sha512-bLvc1WOz/14aPImu/cufKAZYfXs/A/owZfSMZ4N+16WGXLoX5lOir53M6odBxvhgmgdxCVnNySJmZKx73T93cg== - -stylelint-config-standard-scss@13.1.0: - version "13.1.0" - resolved "https://registry.yarnpkg.com/stylelint-config-standard-scss/-/stylelint-config-standard-scss-13.1.0.tgz#2be36ca13087325a42c1f26df8267808667cc886" - integrity sha512-Eo5w7/XvwGHWkeGLtdm2FZLOMYoZl1omP2/jgFCXyl2x5yNz7/8vv4Tj6slHvMSSUNTaGoam/GAZ0ZhukvalfA== - dependencies: - stylelint-config-recommended-scss "^14.0.0" - stylelint-config-standard "^36.0.0" - -stylelint-config-standard@^36.0.0: - version "36.0.1" - resolved "https://registry.yarnpkg.com/stylelint-config-standard/-/stylelint-config-standard-36.0.1.tgz#727cbb2a1ef3e210f5ce8329cde531129f156609" - integrity sha512-8aX8mTzJ6cuO8mmD5yon61CWuIM4UD8Q5aBcWKGSf6kg+EC3uhB+iOywpTK4ca6ZL7B49en8yanOFtUW0qNzyw== - dependencies: - stylelint-config-recommended "^14.0.1" - stylelint-declaration-strict-value@1.10.6: version "1.10.6" resolved "https://registry.yarnpkg.com/stylelint-declaration-strict-value/-/stylelint-declaration-strict-value-1.10.6.tgz#7eb5ffc73cedc03057685c005ebed69911be71fa" @@ -4660,7 +4597,7 @@ stylelint-order@6.0.4, stylelint-order@^6.0.4: postcss "^8.4.32" postcss-sorting "^8.0.2" -stylelint-scss@6.4.1, stylelint-scss@^6.4.0: +stylelint-scss@6.4.1: version "6.4.1" resolved "https://registry.yarnpkg.com/stylelint-scss/-/stylelint-scss-6.4.1.tgz#78a197bbcdf9a61b7365769a9a42dddc722a24c5" integrity sha512-+clI2bQC2FPOt06ZwUlXZZ95IO2C5bKTP0GLN1LNQPVvISfSNcgMKv/VTwym1mK9vnqhHbOk8lO4rj4nY7L9pw== @@ -4671,52 +4608,7 @@ stylelint-scss@6.4.1, stylelint-scss@^6.4.0: postcss-selector-parser "^6.1.0" postcss-value-parser "^4.2.0" -stylelint@16.6.1: - version "16.6.1" - resolved "https://registry.yarnpkg.com/stylelint/-/stylelint-16.6.1.tgz#84735aca2bb5cde535572b7a9b878d2ec983a570" - integrity sha512-yNgz2PqWLkhH2hw6X9AweV9YvoafbAD5ZsFdKN9BvSDVwGvPh+AUIrn7lYwy1S7IHmtFin75LLfX1m0D2tHu8Q== - dependencies: - "@csstools/css-parser-algorithms" "^2.6.3" - "@csstools/css-tokenizer" "^2.3.1" - "@csstools/media-query-list-parser" "^2.1.11" - "@csstools/selector-specificity" "^3.1.1" - "@dual-bundle/import-meta-resolve" "^4.1.0" - balanced-match "^2.0.0" - colord "^2.9.3" - cosmiconfig "^9.0.0" - css-functions-list "^3.2.2" - css-tree "^2.3.1" - debug "^4.3.4" - fast-glob "^3.3.2" - fastest-levenshtein "^1.0.16" - file-entry-cache "^9.0.0" - global-modules "^2.0.0" - globby "^11.1.0" - globjoin "^0.1.4" - html-tags "^3.3.1" - ignore "^5.3.1" - imurmurhash "^0.1.4" - is-plain-object "^5.0.0" - known-css-properties "^0.31.0" - mathml-tag-names "^2.1.3" - meow "^13.2.0" - micromatch "^4.0.7" - normalize-path "^3.0.0" - picocolors "^1.0.1" - postcss "^8.4.38" - postcss-resolve-nested-selector "^0.1.1" - postcss-safe-parser "^7.0.0" - postcss-selector-parser "^6.1.0" - postcss-value-parser "^4.2.0" - resolve-from "^5.0.0" - string-width "^4.2.3" - strip-ansi "^7.1.0" - supports-hyperlinks "^3.0.0" - svg-tags "^1.0.0" - table "^6.8.2" - write-file-atomic "^5.0.1" - -stylelint@^16.8.0: +stylelint@16.8.1, stylelint@^16.8.0: version "16.8.1" resolved "https://registry.yarnpkg.com/stylelint/-/stylelint-16.8.1.tgz#7d4b2d7922771dd0514446a66f04e954f1dfa444" integrity sha512-O8aDyfdODSDNz/B3gW2HQ+8kv8pfhSu7ZR7xskQ93+vI6FhKKGUJMQ03Ydu+w3OvXXE0/u4hWU4hCPNOyld+OA== From b6d6ade41156b1590c25c09be748b1ed46228599 Mon Sep 17 00:00:00 2001 From: Patrick Taylor Date: Sun, 4 Aug 2024 13:42:57 +0100 Subject: [PATCH 03/11] =?UTF-8?q?Configured=20`stylelint-declaration-stric?= =?UTF-8?q?t-value`=20=F0=9F=AA=A2?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- config/stylelint.config.js | 2 +- config/stylelint/rules/declaration-strict-value.ts | 8 +++++++- config/stylelint/rules/index.ts | 4 ++-- config/stylelint/rules/order.ts | 2 +- 4 files changed, 11 insertions(+), 5 deletions(-) diff --git a/config/stylelint.config.js b/config/stylelint.config.js index 3aa78cf..44c454d 100644 --- a/config/stylelint.config.js +++ b/config/stylelint.config.js @@ -11,7 +11,7 @@ export default () => ({ 'function-no-unknown': null, // scss/function-no-unknown 'property-no-unknown': null, // scss/property-no-unknown ...Rules.DeclarationStrictValue, - ...Rules.SCSS, + ...Rules.Scss, }, }], plugins: [ diff --git a/config/stylelint/rules/declaration-strict-value.ts b/config/stylelint/rules/declaration-strict-value.ts index 9ad2ee1..49e7958 100644 --- a/config/stylelint/rules/declaration-strict-value.ts +++ b/config/stylelint/rules/declaration-strict-value.ts @@ -1,3 +1,9 @@ // https://github.com/AndyOGo/stylelint-declaration-strict-value -export default {} +export default { + 'scale-unlimited/declaration-strict-value': [ + ['/color$/', 'fill', 'stroke', 'font-size'], { + disableFix: true, + }, + ], +} diff --git a/config/stylelint/rules/index.ts b/config/stylelint/rules/index.ts index dc3c87f..4664b43 100644 --- a/config/stylelint/rules/index.ts +++ b/config/stylelint/rules/index.ts @@ -1,13 +1,13 @@ import DeclarationStrictValue from './declaration-strict-value' import Order from './order' -import SCSS from './scss' +import Scss from './scss' import Stylelint from './stylelint' import Stylistic from './stylistic' const Rules = { DeclarationStrictValue, Order, - SCSS, + Scss, Stylelint, Stylistic, } diff --git a/config/stylelint/rules/order.ts b/config/stylelint/rules/order.ts index 1de7286..7b7db95 100644 --- a/config/stylelint/rules/order.ts +++ b/config/stylelint/rules/order.ts @@ -1,3 +1,3 @@ -// https://github.com/hudochenkov/stylelint-order/tree/master +// https://github.com/hudochenkov/stylelint-order export default {} From 2b18df9385ca34b9a6faf2e06868223dc7f4ed0b Mon Sep 17 00:00:00 2001 From: Patrick Taylor Date: Sun, 4 Aug 2024 13:54:18 +0100 Subject: [PATCH 04/11] =?UTF-8?q?Configured=20`stylelint-order`=20?= =?UTF-8?q?=F0=9F=94=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .depcheckrc | 5 +++++ config/stylelint/rules/order.ts | 27 ++++++++++++++++++++++++++- 2 files changed, 31 insertions(+), 1 deletion(-) diff --git a/.depcheckrc b/.depcheckrc index 3b1c631..ebdce57 100644 --- a/.depcheckrc +++ b/.depcheckrc @@ -1,4 +1,9 @@ ignores: [ + "@stylistic/stylelint-plugin", + "stylelint-config-property-sort-order-smacss", + "stylelint-declaration-strict-value", + "stylelint-order", + "stylelint-scss", "@types/jest", "rimraf" ] diff --git a/config/stylelint/rules/order.ts b/config/stylelint/rules/order.ts index 7b7db95..9c89dde 100644 --- a/config/stylelint/rules/order.ts +++ b/config/stylelint/rules/order.ts @@ -1,3 +1,28 @@ // https://github.com/hudochenkov/stylelint-order -export default {} +export default { + 'order/order': [ + 'custom-properties', + 'dollar-variables', + 'less-mixins', + 'at-variables', + { + name: 'extends', + type: 'at-rule', + }, + 'at-rules', + 'declarations', + 'rules', + { + hasBlock: true, + name: 'include', + parameter: 'media', + type: 'at-rule', + }, + { + hasBlock: true, + name: 'media', + type: 'at-rule', + }, + ], +} From d6f2069d71edd37ce75b8f5702b8b25d0dae3ccd Mon Sep 17 00:00:00 2001 From: Patrick Taylor Date: Mon, 5 Aug 2024 17:05:37 +0100 Subject: [PATCH 05/11] =?UTF-8?q?Configured=20`stylelint-scss`=20?= =?UTF-8?q?=F0=9F=8C=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- config/stylelint.config.js | 1 + config/stylelint/constants.ts | 8 +++ config/stylelint/rules/scss.ts | 91 +++++++++++++++++++++++++++++++++- package.json | 2 +- yarn.lock | 31 ++++-------- 5 files changed, 110 insertions(+), 23 deletions(-) create mode 100644 config/stylelint/constants.ts diff --git a/config/stylelint.config.js b/config/stylelint.config.js index 44c454d..f2760df 100644 --- a/config/stylelint.config.js +++ b/config/stylelint.config.js @@ -8,6 +8,7 @@ export default () => ({ files: ['**/*.scss'], // TODO: Extend and make dry rules: { 'at-rule-no-unknown': null, // scss/at-rule-no-unknown + 'comment-no-empty': null, // scss/comment-no-empty 'function-no-unknown': null, // scss/function-no-unknown 'property-no-unknown': null, // scss/property-no-unknown ...Rules.DeclarationStrictValue, diff --git a/config/stylelint/constants.ts b/config/stylelint/constants.ts new file mode 100644 index 0000000..0126a60 --- /dev/null +++ b/config/stylelint/constants.ts @@ -0,0 +1,8 @@ +const REGEX_PATTERNS = { + HYPHENATED_BEM: '^[a-z]+(-[a-z]+)*(__[a-z]+)*$', + KEBAB: '^[a-z]+(-[a-z]+)*$', +} + +export { + REGEX_PATTERNS, +} diff --git a/config/stylelint/rules/scss.ts b/config/stylelint/rules/scss.ts index 9471886..58c3c9d 100644 --- a/config/stylelint/rules/scss.ts +++ b/config/stylelint/rules/scss.ts @@ -1,3 +1,92 @@ // https://github.com/stylelint-scss/stylelint-scss -export default {} +import { REGEX_PATTERNS } from '../constants' + +export default { + 'scss/at-each-key-value-single-line': true, + 'scss/at-else-closing-brace-newline-after': 'always-last-in-chain', + 'scss/at-else-closing-brace-space-after': 'always-intermediate', + 'scss/at-else-empty-line-before': 'never', + 'scss/at-else-if-parentheses-space-before': 'always', + 'scss/at-extend-no-missing-placeholder': true, + // 'scss/at-function-named-arguments': ['always', { + // ignore: ['single-argument'], + // ignoreFunctions: [], + // }], + 'scss/at-function-parentheses-space-before': 'never', + 'scss/at-function-pattern': REGEX_PATTERNS.KEBAB, + 'scss/at-if-closing-brace-newline-after': 'always-last-in-chain', + 'scss/at-if-closing-brace-space-after': 'always-intermediate', + 'scss/at-if-no-null': true, + // 'scss/at-import-partial-extension-allowed-list': [], + // 'scss/at-import-partial-extension-disallowed-list': [], + 'scss/at-mixin-argumentless-call-parentheses': 'never', + // 'scss/at-mixin-named-arguments': ['always', { + // ignore: ['single-argument'], + // }], + 'scss/at-mixin-no-risky-nesting-selector': true, + 'scss/at-mixin-parentheses-space-before': 'never', + 'scss/at-mixin-pattern': REGEX_PATTERNS.KEBAB, + 'scss/at-root-no-redundant': true, + 'scss/at-rule-conditional-no-parentheses': true, + 'scss/at-rule-no-unknown': true, + 'scss/at-use-no-redundant-alias': true, + 'scss/at-use-no-unnamespaced': true, + 'scss/block-no-redundant-nesting': true, // This rule might need to be disabled when writing overriding styles. In such cases, it is recommended to disable the rule in the file to make it clear that the nesting is intentional. + 'scss/comment-no-empty': true, + 'scss/comment-no-loud': true, + 'scss/declaration-nested-properties': 'never', + 'scss/declaration-nested-properties-no-divided-groups': true, + // 'scss/declaration-property-value-no-unknown': true, // Experimental + 'scss/dimension-no-non-numeric-values': true, + 'scss/dollar-variable-colon-newline-after': 'always-multi-line', + 'scss/dollar-variable-colon-space-after': 'always-single-line', + 'scss/dollar-variable-colon-space-before': 'never', + 'scss/dollar-variable-default': true, + 'scss/dollar-variable-empty-line-after': ['always', { + except: ['before-dollar-variable'], + ignore: ['before-comment'], + }], + 'scss/dollar-variable-empty-line-before': ['always', { + except: ['after-dollar-variable', 'first-nested'], + ignore: ['after-comment'], + }], + 'scss/dollar-variable-first-in-block': [true, { + ignore: ['comments', 'imports'], + }], + 'scss/dollar-variable-no-missing-interpolation': true, + 'scss/dollar-variable-no-namespaced-assignment': true, + 'scss/dollar-variable-pattern': REGEX_PATTERNS.KEBAB, + 'scss/double-slash-comment-empty-line-before': ['always', { + except: ['first-nested'], + ignore: ['between-comments', 'stylelint-commands'], + }], + // 'scss/double-slash-comment-inline': 'always', + 'scss/double-slash-comment-whitespace-inside': 'always', + 'scss/function-calculation-no-interpolation': true, + 'scss/function-color-relative': true, + // 'scss/function-disallowed-list': [], + 'scss/function-no-unknown': true, + 'scss/function-quote-no-quoted-strings-inside': true, + 'scss/function-unquote-no-unquoted-strings-inside': true, + 'scss/load-no-partial-leading-underscore': true, + 'scss/load-partial-extension': 'never', + // 'scss/map-keys-quotes': 'always', + 'scss/media-feature-value-dollar-variable': ['always', { + ignore: ['keywords'], + }], + // 'scss/no-dollar-variables': true, + 'scss/no-duplicate-dollar-variables': true, + 'scss/no-duplicate-mixins': true, + 'scss/no-global-function-names': true, + 'scss/no-unused-private-members': true, + 'scss/operator-no-newline-after': true, + 'scss/operator-no-newline-before': true, + 'scss/operator-no-unspaced': true, + 'scss/partial-no-import': true, + 'scss/percent-placeholder-pattern': REGEX_PATTERNS.KEBAB, + 'scss/property-no-unknown': true, + // 'scss/selector-nest-combinators': 'always', + 'scss/selector-no-redundant-nesting-selector': true, + // 'scss/selector-no-union-class-name': false, +} diff --git a/package.json b/package.json index 9756817..39e8345 100644 --- a/package.json +++ b/package.json @@ -44,7 +44,7 @@ "stylelint-config-property-sort-order-smacss": "10.0.0", "stylelint-declaration-strict-value": "1.10.6", "stylelint-order": "6.0.4", - "stylelint-scss": "6.4.1" + "stylelint-scss": "6.5.0" }, "devDependencies": { "@babel/core": "7.24.6", diff --git a/yarn.lock b/yarn.lock index e876d06..ed92b79 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2364,7 +2364,7 @@ css-property-sort-order-smacss@~2.2.0: resolved "https://registry.yarnpkg.com/css-property-sort-order-smacss/-/css-property-sort-order-smacss-2.2.0.tgz#c2cb4741e5580fe2f6d968ccde0946e8b689033c" integrity sha512-nXutswsivIEBOrPo/OZw2KQjFPLvtg68aovJf6Kqrm3L6FmTvvFPaeDrk83hh0+pRJGuP3PeKJwMS0E6DFipdQ== -css-tree@^2.3.1: +css-tree@2.3.1, css-tree@^2.3.1: version "2.3.1" resolved "https://registry.yarnpkg.com/css-tree/-/css-tree-2.3.1.tgz#10264ce1e5442e8572fc82fbe490644ff54b5c20" integrity sha512-6Fv1DV/TYw//QF5IzQdqsNDjx/wc8TrMBZsqjL9eW01tWb7R7k/mq+/VXfJCl7SoD5emsJop9cOByJZfs8hYIw== @@ -3153,7 +3153,7 @@ is-path-inside@^3.0.3: resolved "https://registry.yarnpkg.com/is-path-inside/-/is-path-inside-3.0.3.tgz#d231362e53a07ff2b0e0ea7fed049161ffd16283" integrity sha512-Fd4gABb+ycGAmKou8eMftCupSir5lRxqf4aD/vd0cD2qc4HL07OjCeuHMr8Ro4CoMaeCKDB0/ECBOVWjTwUvPQ== -is-plain-object@^5.0.0: +is-plain-object@5.0.0, is-plain-object@^5.0.0: version "5.0.0" resolved "https://registry.yarnpkg.com/is-plain-object/-/is-plain-object-5.0.0.tgz#4427f50ab3429e9025ea7d52e9043a9ef4159344" integrity sha512-VRSzKkbMm5jMDoKLbltAkFQ5Qr7VDiTFGXxYFXXowVj387GeGNOCsOH6Msy00SGZ3Fp84b1Naa1psqgcCIEP5Q== @@ -4128,11 +4128,6 @@ postcss-media-query-parser@^0.2.3: resolved "https://registry.yarnpkg.com/postcss-media-query-parser/-/postcss-media-query-parser-0.2.3.tgz#27b39c6f4d94f81b1a73b8f76351c609e5cef244" integrity sha512-3sOlxmbKcSHMjlUXQZKQ06jOswE7oVkXPxmZdoB1r5l0q6gTFTQSHxNxOrCccElbW7dxNytifNEo8qidX2Vsig== -postcss-resolve-nested-selector@^0.1.1: - version "0.1.1" - resolved "https://registry.yarnpkg.com/postcss-resolve-nested-selector/-/postcss-resolve-nested-selector-0.1.1.tgz#29ccbc7c37dedfac304e9fff0bf1596b3f6a0e4e" - integrity sha512-HvExULSwLqHLgUy1rl3ANIqCsvMS0WHss2UOsXhXnQaZ9VCc2oBvIpXrl00IUFT5ZDITME0o6oiXeiHr2SAIfw== - postcss-resolve-nested-selector@^0.1.4: version "0.1.4" resolved "https://registry.yarnpkg.com/postcss-resolve-nested-selector/-/postcss-resolve-nested-selector-0.1.4.tgz#0068767902fb40f0e6cd7b24faee4fa4bc14a5da" @@ -4143,14 +4138,6 @@ postcss-safe-parser@^7.0.0: resolved "https://registry.yarnpkg.com/postcss-safe-parser/-/postcss-safe-parser-7.0.0.tgz#6273d4e5149e286db5a45bc6cf6eafcad464014a" integrity sha512-ovehqRNVCpuFzbXoTb4qLtyzK3xn3t/CUBxOs8LsnQjQrShaB4lKiHoVqY8ANaC0hBMHq5QVWk77rwGklFUDrg== -postcss-selector-parser@^6.1.0: - version "6.1.0" - resolved "https://registry.yarnpkg.com/postcss-selector-parser/-/postcss-selector-parser-6.1.0.tgz#49694cb4e7c649299fea510a29fa6577104bcf53" - integrity sha512-UMz42UD0UY0EApS0ZL9o1XnLhSTtvvvLe5Dc2H2O56fvRZi+KulDyf5ctDhhtYJBGKStV2FL1fy6253cmLgqVQ== - dependencies: - cssesc "^3.0.0" - util-deprecate "^1.0.2" - postcss-selector-parser@^6.1.1: version "6.1.1" resolved "https://registry.yarnpkg.com/postcss-selector-parser/-/postcss-selector-parser-6.1.1.tgz#5be94b277b8955904476a2400260002ce6c56e38" @@ -4597,15 +4584,17 @@ stylelint-order@6.0.4, stylelint-order@^6.0.4: postcss "^8.4.32" postcss-sorting "^8.0.2" -stylelint-scss@6.4.1: - version "6.4.1" - resolved "https://registry.yarnpkg.com/stylelint-scss/-/stylelint-scss-6.4.1.tgz#78a197bbcdf9a61b7365769a9a42dddc722a24c5" - integrity sha512-+clI2bQC2FPOt06ZwUlXZZ95IO2C5bKTP0GLN1LNQPVvISfSNcgMKv/VTwym1mK9vnqhHbOk8lO4rj4nY7L9pw== +stylelint-scss@6.5.0: + version "6.5.0" + resolved "https://registry.yarnpkg.com/stylelint-scss/-/stylelint-scss-6.5.0.tgz#c5495f254195c41b97f9bc995e4d3725b375447a" + integrity sha512-yOnYlr71wrTPT3rYyUurgTj6Rw7JUtzsZQsiPEjvs+k/yqoYHdweqpw6XN/ARpxjAuvJpddoMUvV8aAIpvUwTg== dependencies: + css-tree "2.3.1" + is-plain-object "5.0.0" known-css-properties "^0.34.0" postcss-media-query-parser "^0.2.3" - postcss-resolve-nested-selector "^0.1.1" - postcss-selector-parser "^6.1.0" + postcss-resolve-nested-selector "^0.1.4" + postcss-selector-parser "^6.1.1" postcss-value-parser "^4.2.0" stylelint@16.8.1, stylelint@^16.8.0: From 4fe925e8caea80adcb815656c42f57dc22160dac Mon Sep 17 00:00:00 2001 From: Patrick Taylor Date: Mon, 12 Aug 2024 17:53:41 +0100 Subject: [PATCH 06/11] =?UTF-8?q?Configured=20`stylelint-stylistic`=20?= =?UTF-8?q?=F0=9F=98=8E?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- config/stylelint/rules/stylistic.ts | 87 ++++++++++++++++++++++++++++- 1 file changed, 86 insertions(+), 1 deletion(-) diff --git a/config/stylelint/rules/stylistic.ts b/config/stylelint/rules/stylistic.ts index 26caf7a..85d24cd 100644 --- a/config/stylelint/rules/stylistic.ts +++ b/config/stylelint/rules/stylistic.ts @@ -1,3 +1,88 @@ // https://github.com/stylelint-stylistic/stylelint-stylistic -export default {} +export default { + '@stylistic/at-rule-name-case': 'lower', + '@stylistic/at-rule-name-newline-after': 'always-multi-line', + '@stylistic/at-rule-name-space-after': 'always-single-line', + '@stylistic/at-rule-semicolon-newline-after': 'always', + '@stylistic/at-rule-semicolon-space-before': 'never', + '@stylistic/block-closing-brace-empty-line-before': 'never', + '@stylistic/block-closing-brace-newline-after': ['always', { + ignoreAtRules: ['if', 'else'], + }], + '@stylistic/block-closing-brace-newline-before': 'always', + '@stylistic/block-closing-brace-space-after': 'always-single-line', + '@stylistic/block-closing-brace-space-before': 'always-single-line', + '@stylistic/block-opening-brace-newline-after': 'always', + '@stylistic/block-opening-brace-newline-before': 'never-single-line', + '@stylistic/block-opening-brace-space-after': 'always-single-line', + '@stylistic/block-opening-brace-space-before': 'always', + '@stylistic/color-hex-case': 'lower', + '@stylistic/declaration-bang-space-after': 'never', + '@stylistic/declaration-bang-space-before': 'always', + '@stylistic/declaration-block-semicolon-newline-after': 'always', + '@stylistic/declaration-block-semicolon-newline-before': 'never-multi-line', + '@stylistic/declaration-block-semicolon-space-after': 'always-single-line', + '@stylistic/declaration-block-semicolon-space-before': 'never', + '@stylistic/declaration-block-trailing-semicolon': 'always', + '@stylistic/declaration-colon-newline-after': 'always-multi-line', + '@stylistic/declaration-colon-space-after': 'always-single-line', + '@stylistic/declaration-colon-space-before': 'never', + '@stylistic/function-comma-newline-after': 'always-multi-line', + '@stylistic/function-comma-newline-before': 'never-multi-line', + '@stylistic/function-comma-space-after': 'always-single-line', + '@stylistic/function-comma-space-before': 'never', + '@stylistic/function-max-empty-lines': 0, + '@stylistic/function-parentheses-newline-inside': 'always-multi-line', + '@stylistic/function-parentheses-space-inside': 'never-single-line', + '@stylistic/function-whitespace-after': 'always', + '@stylistic/indentation': 2, + '@stylistic/linebreaks': 'unix', + '@stylistic/max-empty-lines': 1, + '@stylistic/max-line-length': [180, { + ignore: ['comments'], + ignorePattern: '/^@import\\s+/', + }], + '@stylistic/media-feature-colon-space-after': 'always', + '@stylistic/media-feature-colon-space-before': 'never', + '@stylistic/media-feature-name-case': 'lower', + '@stylistic/media-feature-parentheses-space-inside': 'never', + '@stylistic/media-feature-range-operator-space-after': 'always', + '@stylistic/media-feature-range-operator-space-before': 'always', + '@stylistic/media-query-list-comma-newline-after': 'always-multi-line', + '@stylistic/media-query-list-comma-newline-before': 'never-multi-line', + '@stylistic/media-query-list-comma-space-after': 'always-single-line', + '@stylistic/media-query-list-comma-space-before': 'never', + '@stylistic/named-grid-areas-alignment': [true, { + alignQuotes: true, + }], + '@stylistic/no-empty-first-line': true, + '@stylistic/no-eol-whitespace': true, + '@stylistic/no-extra-semicolons': true, + '@stylistic/no-missing-end-of-source-newline': true, + '@stylistic/number-leading-zero': 'never', + '@stylistic/number-no-trailing-zeros': true, + '@stylistic/property-case': 'lower', + '@stylistic/selector-attribute-brackets-space-inside': 'never', + '@stylistic/selector-attribute-operator-space-after': 'never', + '@stylistic/selector-attribute-operator-space-before': 'never', + '@stylistic/selector-combinator-space-after': 'always', + '@stylistic/selector-combinator-space-before': 'always', + '@stylistic/selector-descendant-combinator-no-non-space': true, + '@stylistic/selector-list-comma-newline-after': 'always-multi-line', + '@stylistic/selector-list-comma-newline-before': 'never-multi-line', + '@stylistic/selector-list-comma-space-after': 'always-single-line', + '@stylistic/selector-list-comma-space-before': 'never', + '@stylistic/selector-max-empty-lines': 0, + '@stylistic/selector-pseudo-class-case': 'lower', + '@stylistic/selector-pseudo-class-parentheses-space-inside': 'never', + '@stylistic/selector-pseudo-element-case': 'lower', + '@stylistic/string-quotes': 'single', + '@stylistic/unicode-bom': 'never', + '@stylistic/unit-case': 'lower', + '@stylistic/value-list-comma-newline-after': 'always-multi-line', + '@stylistic/value-list-comma-newline-before': 'never-multi-line', + '@stylistic/value-list-comma-space-after': 'always-single-line', + '@stylistic/value-list-comma-space-before': 'never', + '@stylistic/value-list-max-empty-lines': 0, +} From 12a1d032c3b7b5340562cca01b7992b94efcd982 Mon Sep 17 00:00:00 2001 From: Patrick Taylor Date: Mon, 12 Aug 2024 21:38:41 +0100 Subject: [PATCH 07/11] =?UTF-8?q?Configured=20`stylelint`=20-=20configurat?= =?UTF-8?q?ion=20from=20previous=20project=20=F0=9F=8F=9A=EF=B8=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- config/stylelint/rules/scss.ts | 4 +- config/stylelint/rules/stylelint.ts | 240 +++++++++++++++++++++++++++- 2 files changed, 242 insertions(+), 2 deletions(-) diff --git a/config/stylelint/rules/scss.ts b/config/stylelint/rules/scss.ts index 58c3c9d..0ab8824 100644 --- a/config/stylelint/rules/scss.ts +++ b/config/stylelint/rules/scss.ts @@ -42,7 +42,9 @@ export default { 'scss/dollar-variable-colon-newline-after': 'always-multi-line', 'scss/dollar-variable-colon-space-after': 'always-single-line', 'scss/dollar-variable-colon-space-before': 'never', - 'scss/dollar-variable-default': true, + 'scss/dollar-variable-default': [true, { + ignore: 'local', + }], 'scss/dollar-variable-empty-line-after': ['always', { except: ['before-dollar-variable'], ignore: ['before-comment'], diff --git a/config/stylelint/rules/stylelint.ts b/config/stylelint/rules/stylelint.ts index 385f4b6..40b1b44 100644 --- a/config/stylelint/rules/stylelint.ts +++ b/config/stylelint/rules/stylelint.ts @@ -1,3 +1,241 @@ // https://stylelint.io/user-guide/rules -export default {} +import { REGEX_PATTERNS } from '../constants' + +/* + * Possible errors + */ + +const possibleErrors = { + 'annotation-no-unknown': true, + 'at-rule-no-unknown': true, + 'block-no-empty': true, + 'color-no-invalid-hex': true, + 'comment-no-empty': true, + 'custom-property-no-missing-var-function': true, + 'declaration-block-no-duplicate-custom-properties': true, + 'declaration-block-no-duplicate-properties': true, + 'declaration-block-no-shorthand-property-overrides': true, + 'font-family-no-duplicate-names': true, + 'font-family-no-missing-generic-family-keyword': true, + 'function-calc-no-unspaced-operator': true, + 'function-linear-gradient-no-nonstandard-direction': true, + 'keyframe-declaration-no-important': true, + 'media-feature-name-no-unknown': true, + 'named-grid-areas-no-invalid': true, + 'no-descending-specificity': true, + 'no-duplicate-at-import-rules': true, + 'no-duplicate-selectors': true, + 'no-empty-source': true, + 'no-extra-semicolons': true, + 'no-invalid-double-slash-comments': true, + 'no-invalid-position-at-import-rule': true, + 'property-no-unknown': true, + 'selector-pseudo-class-no-unknown': true, + 'selector-pseudo-element-no-unknown': true, + 'selector-type-no-unknown': true, + 'string-no-newline': true, + 'unit-no-unknown': true, +} + +/* + * Limit language features + */ + +const limitLanguageFeatures = { + 'alpha-value-notation': 'number', + // 'at-rule-allowed-list': false, + 'at-rule-disallowed-list': ['debug'], + 'at-rule-no-vendor-prefix': true, + // 'at-rule-property-required-list': false, + 'color-function-notation': 'modern', + 'color-hex-alpha': 'never', + 'color-named': 'never', + // 'color-no-hex': false, + // 'comment-pattern': false, + // 'comment-word-disallowed-list': false, + 'custom-media-pattern': REGEX_PATTERNS.KEBAB, + 'custom-property-pattern': REGEX_PATTERNS.KEBAB, + 'declaration-block-no-redundant-longhand-properties': true, + 'declaration-block-single-line-max-declarations': 1, + // 'declaration-no-important': false, + // 'declaration-property-unit-allowed-list': false, + // 'declaration-property-unit-disallowed-list': false, + // 'declaration-property-value-allowed-list': false, + 'declaration-property-value-disallowed-list': { + transform: ['all'], + }, + 'font-weight-notation': 'numeric', + // 'function-allowed-list': false, + // 'function-disallowed-list': false, + 'function-url-no-scheme-relative': true, + // 'function-url-scheme-allowed-list': false, + // 'function-url-scheme-disallowed-list': false, + 'hue-degree-notation': 'angle', + 'keyframe-selector-notation': 'percentage-unless-within-keyword-only-block', + 'keyframes-name-pattern': REGEX_PATTERNS.KEBAB, + 'length-zero-no-unit': true, + 'max-nesting-depth': [3, { + ignore: ['blockless-at-rules', 'pseudo-classes'], + }], + // 'media-feature-name-allowed-list': false, + // 'media-feature-name-disallowed-list': false, + 'media-feature-name-no-vendor-prefix': true, + // 'media-feature-name-value-allowed-list': false, + 'no-unknown-animations': true, + 'number-max-precision': 2, + // 'property-allowed-list': false, + 'property-disallowed-list': ['font-size', 'opacity', 'text-overflow', 'z-index'], + 'property-no-vendor-prefix': true, + // 'rule-selector-property-disallowed-list': false, + // 'selector-attribute-name-disallowed-list': false, + // 'selector-attribute-operator-allowed-list': false, + // 'selector-attribute-operator-disallowed-list': false, + 'selector-class-pattern': REGEX_PATTERNS.HYPHENATED_BEM, + // 'selector-combinator-allowed-list': false, + // 'selector-combinator-disallowed-list': false, + // 'selector-disallowed-list': false, + 'selector-id-pattern': REGEX_PATTERNS.KEBAB, + 'selector-max-attribute': 1, + 'selector-max-class': 3, + 'selector-max-combinators': 3, + 'selector-max-compound-selectors': 4, + 'selector-max-empty-lines': 0, + 'selector-max-id': 1, + 'selector-max-pseudo-class': 2, + // 'selector-max-specificity': false, + 'selector-max-type': 2, + 'selector-max-universal': 1, + // 'selector-nested-pattern': false, + 'selector-no-qualifying-type': true, + 'selector-no-vendor-prefix': true, + // 'selector-pseudo-class-allowed-list': false, + // 'selector-pseudo-class-disallowed-list': false, + // 'selector-pseudo-element-allowed-list': false, + 'selector-pseudo-element-colon-notation': 'double', + // 'selector-pseudo-element-disallowed-list': false, + 'shorthand-property-no-redundant-values': true, + // 'time-min-milliseconds': false, + // 'unit-allowed-list': false, + // 'unit-disallowed-list': false, + 'value-no-vendor-prefix': true, +} + +/* + * Stylistic issues + */ + +const stylisticIssues = { + 'at-rule-empty-line-before': ['always', { + except: ['after-same-name', 'first-nested'], + ignore: ['after-comment'], + ignoreAtRules: ['else', 'mixin', 'return', 'warn'], + }], + 'at-rule-name-case': 'lower', + 'at-rule-name-newline-after': 'always-multi-line', + 'at-rule-name-space-after': 'always-single-line', + 'at-rule-semicolon-newline-after': 'always', + 'at-rule-semicolon-space-before': 'never', + 'block-closing-brace-empty-line-before': 'never', + 'block-closing-brace-newline-after': ['always', { + ignoreAtRules: ['if', 'else'], + }], + 'block-closing-brace-newline-before': 'always', + 'block-closing-brace-space-after': 'always-single-line', + 'block-closing-brace-space-before': 'always-single-line', + 'block-opening-brace-newline-after': 'always', + 'block-opening-brace-newline-before': 'never-single-line', + 'block-opening-brace-space-after': 'always-single-line', + 'block-opening-brace-space-before': 'always', + 'color-hex-case': 'lower', + 'color-hex-length': 'short', + 'comment-empty-line-before': ['always', { + except: ['first-nested'], + }], + 'comment-whitespace-inside': 'always', + 'custom-property-empty-line-before': ['always', { + except: ['after-comment', 'after-custom-property', 'first-nested'], + }], + 'declaration-bang-space-after': 'never', + 'declaration-bang-space-before': 'always', + 'declaration-block-semicolon-newline-after': 'always', + 'declaration-block-semicolon-newline-before': 'never-multi-line', + 'declaration-block-semicolon-space-after': 'always-single-line', + 'declaration-block-semicolon-space-before': 'never', + 'declaration-block-trailing-semicolon': 'always', + 'declaration-colon-newline-after': 'always-multi-line', + 'declaration-colon-space-after': 'always-single-line', + 'declaration-colon-space-before': 'never', + 'declaration-empty-line-before': ['always', { + except: ['after-comment', 'after-declaration', 'first-nested'], + }], + 'font-family-name-quotes': 'always-where-required', + 'function-comma-newline-after': 'always-multi-line', + 'function-comma-newline-before': 'never-multi-line', + 'function-comma-space-after': 'always', + 'function-comma-space-before': 'never', + 'function-max-empty-lines': 0, + 'function-name-case': 'lower', + 'function-parentheses-newline-inside': 'always-multi-line', + 'function-parentheses-space-inside': 'never-single-line', + 'function-url-quotes': 'always', + 'function-whitespace-after': 'always', + 'indentation': 2, + 'linebreaks': 'unix', + 'max-empty-lines': 1, + 'max-line-length': [180, { + ignore: ['comments'], + }], + 'media-feature-colon-space-after': 'always', + 'media-feature-colon-space-before': 'never', + 'media-feature-name-case': 'lower', + 'media-feature-parentheses-space-inside': 'never', + 'media-feature-range-operator-space-after': 'always', + 'media-feature-range-operator-space-before': 'always', + 'media-query-list-comma-newline-after': 'always-multi-line', + 'media-query-list-comma-newline-before': 'never-multi-line', + 'media-query-list-comma-space-after': 'always-single-line', + 'media-query-list-comma-space-before': 'never', + 'no-empty-first-line': true, + 'no-eol-whitespace': true, + 'no-irregular-whitespace': true, + 'no-missing-end-of-source-newline': true, + 'number-leading-zero': 'never', + 'number-no-trailing-zeros': true, + 'property-case': 'lower', + 'rule-empty-line-before': ['always', { + ignore: ['after-comment', 'first-nested'], + }], + 'selector-attribute-brackets-space-inside': 'never', + 'selector-attribute-operator-space-after': 'never', + 'selector-attribute-operator-space-before': 'never', + 'selector-attribute-quotes': 'always', + 'selector-combinator-space-after': 'always', + 'selector-combinator-space-before': 'always', + 'selector-descendant-combinator-no-non-space': true, + 'selector-list-comma-newline-after': 'always-multi-line', + 'selector-list-comma-newline-before': 'never-multi-line', + 'selector-list-comma-space-after': 'always-single-line', + 'selector-list-comma-space-before': 'never', + 'selector-pseudo-class-case': 'lower', + 'selector-pseudo-class-parentheses-space-inside': 'never', + 'selector-pseudo-element-case': 'lower', + 'selector-type-case': 'lower', + 'string-quotes': 'single', + 'unicode-bom': 'never', + 'unit-case': 'lower', + 'value-keyword-case': ['lower', { + ignoreProperties: ['font-family', '/^\\$font-family(-{1}.*)*/'], // all scss variables with fonts should be named either "font-family" or "font-family-x" + }], + 'value-list-comma-newline-after': 'always-multi-line', + 'value-list-comma-newline-before': 'never-multi-line', + 'value-list-comma-space-after': 'always', + 'value-list-comma-space-before': 'never', + 'value-list-max-empty-lines': 0, +} + +export default { + ...possibleErrors, + ...limitLanguageFeatures, + ...stylisticIssues, +} From 99560b78cc9cac516f1796ff0917348c936a7ada Mon Sep 17 00:00:00 2001 From: Patrick Taylor Date: Mon, 12 Aug 2024 21:44:34 +0100 Subject: [PATCH 08/11] =?UTF-8?q?Configured=20`stylelint`=20-=20deprecated?= =?UTF-8?q?=20rules=20moved=20to=20@stylistic=20=F0=9F=8F=A0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- config/stylelint/rules/stylelint.ts | 80 ----------------------------- 1 file changed, 80 deletions(-) diff --git a/config/stylelint/rules/stylelint.ts b/config/stylelint/rules/stylelint.ts index 40b1b44..3e9b95c 100644 --- a/config/stylelint/rules/stylelint.ts +++ b/config/stylelint/rules/stylelint.ts @@ -27,7 +27,6 @@ const possibleErrors = { 'no-duplicate-at-import-rules': true, 'no-duplicate-selectors': true, 'no-empty-source': true, - 'no-extra-semicolons': true, 'no-invalid-double-slash-comments': true, 'no-invalid-position-at-import-rule': true, 'property-no-unknown': true, @@ -100,7 +99,6 @@ const limitLanguageFeatures = { 'selector-max-class': 3, 'selector-max-combinators': 3, 'selector-max-compound-selectors': 4, - 'selector-max-empty-lines': 0, 'selector-max-id': 1, 'selector-max-pseudo-class': 2, // 'selector-max-specificity': false, @@ -131,23 +129,6 @@ const stylisticIssues = { ignore: ['after-comment'], ignoreAtRules: ['else', 'mixin', 'return', 'warn'], }], - 'at-rule-name-case': 'lower', - 'at-rule-name-newline-after': 'always-multi-line', - 'at-rule-name-space-after': 'always-single-line', - 'at-rule-semicolon-newline-after': 'always', - 'at-rule-semicolon-space-before': 'never', - 'block-closing-brace-empty-line-before': 'never', - 'block-closing-brace-newline-after': ['always', { - ignoreAtRules: ['if', 'else'], - }], - 'block-closing-brace-newline-before': 'always', - 'block-closing-brace-space-after': 'always-single-line', - 'block-closing-brace-space-before': 'always-single-line', - 'block-opening-brace-newline-after': 'always', - 'block-opening-brace-newline-before': 'never-single-line', - 'block-opening-brace-space-after': 'always-single-line', - 'block-opening-brace-space-before': 'always', - 'color-hex-case': 'lower', 'color-hex-length': 'short', 'comment-empty-line-before': ['always', { except: ['first-nested'], @@ -156,82 +137,21 @@ const stylisticIssues = { 'custom-property-empty-line-before': ['always', { except: ['after-comment', 'after-custom-property', 'first-nested'], }], - 'declaration-bang-space-after': 'never', - 'declaration-bang-space-before': 'always', - 'declaration-block-semicolon-newline-after': 'always', - 'declaration-block-semicolon-newline-before': 'never-multi-line', - 'declaration-block-semicolon-space-after': 'always-single-line', - 'declaration-block-semicolon-space-before': 'never', - 'declaration-block-trailing-semicolon': 'always', - 'declaration-colon-newline-after': 'always-multi-line', - 'declaration-colon-space-after': 'always-single-line', - 'declaration-colon-space-before': 'never', 'declaration-empty-line-before': ['always', { except: ['after-comment', 'after-declaration', 'first-nested'], }], 'font-family-name-quotes': 'always-where-required', - 'function-comma-newline-after': 'always-multi-line', - 'function-comma-newline-before': 'never-multi-line', - 'function-comma-space-after': 'always', - 'function-comma-space-before': 'never', - 'function-max-empty-lines': 0, 'function-name-case': 'lower', - 'function-parentheses-newline-inside': 'always-multi-line', - 'function-parentheses-space-inside': 'never-single-line', 'function-url-quotes': 'always', - 'function-whitespace-after': 'always', - 'indentation': 2, - 'linebreaks': 'unix', - 'max-empty-lines': 1, - 'max-line-length': [180, { - ignore: ['comments'], - }], - 'media-feature-colon-space-after': 'always', - 'media-feature-colon-space-before': 'never', - 'media-feature-name-case': 'lower', - 'media-feature-parentheses-space-inside': 'never', - 'media-feature-range-operator-space-after': 'always', - 'media-feature-range-operator-space-before': 'always', - 'media-query-list-comma-newline-after': 'always-multi-line', - 'media-query-list-comma-newline-before': 'never-multi-line', - 'media-query-list-comma-space-after': 'always-single-line', - 'media-query-list-comma-space-before': 'never', - 'no-empty-first-line': true, - 'no-eol-whitespace': true, 'no-irregular-whitespace': true, - 'no-missing-end-of-source-newline': true, - 'number-leading-zero': 'never', - 'number-no-trailing-zeros': true, - 'property-case': 'lower', 'rule-empty-line-before': ['always', { ignore: ['after-comment', 'first-nested'], }], - 'selector-attribute-brackets-space-inside': 'never', - 'selector-attribute-operator-space-after': 'never', - 'selector-attribute-operator-space-before': 'never', 'selector-attribute-quotes': 'always', - 'selector-combinator-space-after': 'always', - 'selector-combinator-space-before': 'always', - 'selector-descendant-combinator-no-non-space': true, - 'selector-list-comma-newline-after': 'always-multi-line', - 'selector-list-comma-newline-before': 'never-multi-line', - 'selector-list-comma-space-after': 'always-single-line', - 'selector-list-comma-space-before': 'never', - 'selector-pseudo-class-case': 'lower', - 'selector-pseudo-class-parentheses-space-inside': 'never', - 'selector-pseudo-element-case': 'lower', 'selector-type-case': 'lower', - 'string-quotes': 'single', - 'unicode-bom': 'never', - 'unit-case': 'lower', 'value-keyword-case': ['lower', { ignoreProperties: ['font-family', '/^\\$font-family(-{1}.*)*/'], // all scss variables with fonts should be named either "font-family" or "font-family-x" }], - 'value-list-comma-newline-after': 'always-multi-line', - 'value-list-comma-newline-before': 'never-multi-line', - 'value-list-comma-space-after': 'always', - 'value-list-comma-space-before': 'never', - 'value-list-max-empty-lines': 0, } export default { From 8abbbc090e99d60c42ce69bed9a1f7442817f3ae Mon Sep 17 00:00:00 2001 From: Patrick Taylor Date: Fri, 16 Aug 2024 19:31:35 +0100 Subject: [PATCH 09/11] =?UTF-8?q?Configured=20`stylelint`=20-=20latest=20r?= =?UTF-8?q?ules=20=F0=9F=8F=A1?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- config/stylelint/rules/stylelint.ts | 283 ++++++++++++++++++---------- 1 file changed, 186 insertions(+), 97 deletions(-) diff --git a/config/stylelint/rules/stylelint.ts b/config/stylelint/rules/stylelint.ts index 3e9b95c..981daa5 100644 --- a/config/stylelint/rules/stylelint.ts +++ b/config/stylelint/rules/stylelint.ts @@ -3,159 +3,248 @@ import { REGEX_PATTERNS } from '../constants' /* - * Possible errors + * Avoid Errors */ -const possibleErrors = { - 'annotation-no-unknown': true, - 'at-rule-no-unknown': true, - 'block-no-empty': true, - 'color-no-invalid-hex': true, - 'comment-no-empty': true, - 'custom-property-no-missing-var-function': true, +const descending = { + 'no-descending-specificity': true, +} + +const duplicate = { 'declaration-block-no-duplicate-custom-properties': true, 'declaration-block-no-duplicate-properties': true, - 'declaration-block-no-shorthand-property-overrides': true, 'font-family-no-duplicate-names': true, - 'font-family-no-missing-generic-family-keyword': true, - 'function-calc-no-unspaced-operator': true, - 'function-linear-gradient-no-nonstandard-direction': true, - 'keyframe-declaration-no-important': true, - 'media-feature-name-no-unknown': true, - 'named-grid-areas-no-invalid': true, - 'no-descending-specificity': true, + 'keyframe-block-no-duplicate-selectors': true, 'no-duplicate-at-import-rules': true, 'no-duplicate-selectors': true, +} + +const empty = { + 'block-no-empty': true, + 'comment-no-empty': true, 'no-empty-source': true, +} + +const invalid = { + 'color-no-invalid-hex': true, + 'function-calc-no-unspaced-operator': true, + 'keyframe-declaration-no-important': true, + 'media-query-no-invalid': true, + 'named-grid-areas-no-invalid': true, 'no-invalid-double-slash-comments': true, 'no-invalid-position-at-import-rule': true, + 'string-no-newline': true, +} + +const irregular = { + 'no-irregular-whitespace': true, +} + +const missing = { + 'custom-property-no-missing-var-function': true, + 'font-family-no-missing-generic-family-keyword': [true, { + ignoreFontFamilies: [], + }], +} + +const nonStandard = { + 'function-linear-gradient-no-nonstandard-direction': true, +} + +const overrides = { + 'declaration-block-no-shorthand-property-overrides': true, +} + +const unmatchable = { + 'selector-anb-no-unmatchable': true, +} + +const unknown = { + 'annotation-no-unknown': true, + 'at-rule-no-unknown': true, + 'declaration-property-value-no-unknown': true, + 'function-no-unknown': true, + 'media-feature-name-no-unknown': true, + 'media-feature-name-value-no-unknown': true, + 'no-unknown-animations': true, + 'no-unknown-custom-media': true, + 'no-unknown-custom-properties': true, 'property-no-unknown': true, 'selector-pseudo-class-no-unknown': true, 'selector-pseudo-element-no-unknown': true, 'selector-type-no-unknown': true, - 'string-no-newline': true, 'unit-no-unknown': true, } /* - * Limit language features + * Enforce Conventions */ -const limitLanguageFeatures = { - 'alpha-value-notation': 'number', - // 'at-rule-allowed-list': false, +const allowedDisallowedAndRequired = { + // 'at-rule-allowed-list': [], 'at-rule-disallowed-list': ['debug'], 'at-rule-no-vendor-prefix': true, - // 'at-rule-property-required-list': false, - 'color-function-notation': 'modern', + // 'at-rule-property-required-list': {}, 'color-hex-alpha': 'never', 'color-named': 'never', - // 'color-no-hex': false, - // 'comment-pattern': false, - // 'comment-word-disallowed-list': false, - 'custom-media-pattern': REGEX_PATTERNS.KEBAB, - 'custom-property-pattern': REGEX_PATTERNS.KEBAB, - 'declaration-block-no-redundant-longhand-properties': true, - 'declaration-block-single-line-max-declarations': 1, - // 'declaration-no-important': false, - // 'declaration-property-unit-allowed-list': false, - // 'declaration-property-unit-disallowed-list': false, - // 'declaration-property-value-allowed-list': false, + // 'color-no-hex': true, + // 'comment-word-disallowed-list': [], + // 'declaration-no-important': true, + // 'declaration-property-unit-allowed-list': {}, + // 'declaration-property-unit-disallowed-list': {}, + // 'declaration-property-value-allowed-list': {}, 'declaration-property-value-disallowed-list': { + position: ['fixed'], transform: ['all'], }, - 'font-weight-notation': 'numeric', - // 'function-allowed-list': false, - // 'function-disallowed-list': false, + // 'function-allowed-list': [], + // 'function-disallowed-list': [], 'function-url-no-scheme-relative': true, - // 'function-url-scheme-allowed-list': false, - // 'function-url-scheme-disallowed-list': false, - 'hue-degree-notation': 'angle', - 'keyframe-selector-notation': 'percentage-unless-within-keyword-only-block', - 'keyframes-name-pattern': REGEX_PATTERNS.KEBAB, + // 'function-url-scheme-allowed-list': [], + // 'function-url-scheme-disallowed-list': [], 'length-zero-no-unit': true, - 'max-nesting-depth': [3, { - ignore: ['blockless-at-rules', 'pseudo-classes'], - }], - // 'media-feature-name-allowed-list': false, - // 'media-feature-name-disallowed-list': false, + // 'media-feature-name-allowed-list': [], + // 'media-feature-name-disallowed-list': [], 'media-feature-name-no-vendor-prefix': true, - // 'media-feature-name-value-allowed-list': false, - 'no-unknown-animations': true, - 'number-max-precision': 2, - // 'property-allowed-list': false, + // 'media-feature-name-unit-allowed-list': {}, + // 'media-feature-name-value-allowed-list': {}, + // 'property-allowed-list': [], 'property-disallowed-list': ['font-size', 'opacity', 'text-overflow', 'z-index'], 'property-no-vendor-prefix': true, - // 'rule-selector-property-disallowed-list': false, - // 'selector-attribute-name-disallowed-list': false, - // 'selector-attribute-operator-allowed-list': false, - // 'selector-attribute-operator-disallowed-list': false, - 'selector-class-pattern': REGEX_PATTERNS.HYPHENATED_BEM, - // 'selector-combinator-allowed-list': false, - // 'selector-combinator-disallowed-list': false, - // 'selector-disallowed-list': false, - 'selector-id-pattern': REGEX_PATTERNS.KEBAB, - 'selector-max-attribute': 1, - 'selector-max-class': 3, - 'selector-max-combinators': 3, - 'selector-max-compound-selectors': 4, - 'selector-max-id': 1, - 'selector-max-pseudo-class': 2, - // 'selector-max-specificity': false, - 'selector-max-type': 2, - 'selector-max-universal': 1, - // 'selector-nested-pattern': false, + // 'rule-selector-property-disallowed-list': {}, + // 'selector-attribute-name-disallowed-list': [], + // 'selector-attribute-operator-allowed-list': [], + // 'selector-attribute-operator-disallowed-list': [], + // 'selector-combinator-allowed-list': [], + // 'selector-combinator-disallowed-list': [], + // 'selector-disallowed-list': [], 'selector-no-qualifying-type': true, 'selector-no-vendor-prefix': true, - // 'selector-pseudo-class-allowed-list': false, - // 'selector-pseudo-class-disallowed-list': false, - // 'selector-pseudo-element-allowed-list': false, - 'selector-pseudo-element-colon-notation': 'double', - // 'selector-pseudo-element-disallowed-list': false, - 'shorthand-property-no-redundant-values': true, - // 'time-min-milliseconds': false, - // 'unit-allowed-list': false, - // 'unit-disallowed-list': false, + // 'selector-pseudo-class-allowed-list': [], + // 'selector-pseudo-class-disallowed-list': [], + // 'selector-pseudo-element-allowed-list': [], + // 'selector-pseudo-element-disallowed-list': [], + // 'unit-allowed-list': [], + // 'unit-disallowed-list': [], 'value-no-vendor-prefix': true, } -/* - * Stylistic issues - */ +const caseSensitive = { + 'function-name-case': 'lower', + 'selector-type-case': 'lower', + 'value-keyword-case': ['lower', { + ignoreProperties: ['font-family', '/^\\$font-family(-{1}.*)*/'], // All scss variables with fonts should be named "font-family-x" + }], +} -const stylisticIssues = { +const emptyLines = { 'at-rule-empty-line-before': ['always', { except: ['after-same-name', 'first-nested'], ignore: ['after-comment'], ignoreAtRules: ['else', 'mixin', 'return', 'warn'], }], - 'color-hex-length': 'short', 'comment-empty-line-before': ['always', { except: ['first-nested'], + ignore: ['stylelint-commands'], }], - 'comment-whitespace-inside': 'always', 'custom-property-empty-line-before': ['always', { except: ['after-comment', 'after-custom-property', 'first-nested'], }], 'declaration-empty-line-before': ['always', { except: ['after-comment', 'after-declaration', 'first-nested'], }], - 'font-family-name-quotes': 'always-where-required', - 'function-name-case': 'lower', - 'function-url-quotes': 'always', - 'no-irregular-whitespace': true, 'rule-empty-line-before': ['always', { - ignore: ['after-comment', 'first-nested'], + except: ['after-single-line-comment', 'first-nested'], }], - 'selector-attribute-quotes': 'always', - 'selector-type-case': 'lower', - 'value-keyword-case': ['lower', { - ignoreProperties: ['font-family', '/^\\$font-family(-{1}.*)*/'], // all scss variables with fonts should be named either "font-family" or "font-family-x" +} + +const maxAndMin = { + 'declaration-block-single-line-max-declarations': 1, + 'declaration-property-max-values': {}, + 'max-nesting-depth': [3, { + ignore: ['blockless-at-rules', 'pseudo-classes'], + ignoreAtRules: ['media'], }], + 'number-max-precision': 2, + 'selector-max-attribute': 2, + 'selector-max-class': 3, + 'selector-max-combinators': 3, + 'selector-max-compound-selectors': 4, + 'selector-max-id': 1, + 'selector-max-pseudo-class': 2, + // 'selector-max-specificity': '', + 'selector-max-type': 2, + 'selector-max-universal': 1, + // 'time-min-milliseconds': 100, +} + +const notation = { + 'alpha-value-notation': 'number', + 'color-function-notation': 'modern', + 'color-hex-length': 'short', + 'font-weight-notation': ['numeric', { + ignore: ['relative'], + }], + 'hue-degree-notation': 'angle', + 'import-notation': 'string', + 'keyframe-selector-notation': 'percentage-unless-within-keyword-only-block', + 'lightness-notation': 'percentage', + 'media-feature-range-notation': 'context', + 'selector-not-notation': 'complex', + 'selector-pseudo-element-colon-notation': 'double', +} + +const pattern = { + // 'comment-pattern': '', + 'custom-media-pattern': REGEX_PATTERNS.KEBAB, + 'custom-property-pattern': REGEX_PATTERNS.KEBAB, + 'keyframes-name-pattern': REGEX_PATTERNS.KEBAB, + 'selector-class-pattern': REGEX_PATTERNS.HYPHENATED_BEM, + 'selector-id-pattern': REGEX_PATTERNS.KEBAB, + // 'selector-nested-pattern': '', +} + +const quotes = { + 'font-family-name-quotes': 'always-where-recommended', + 'function-url-quotes': ['always', { + except: ['empty'], + }], + 'selector-attribute-quotes': 'always', +} + +const redundant = { + 'declaration-block-no-redundant-longhand-properties': true, + 'shorthand-property-no-redundant-values': true, +} + +const whitespaceInside = { + 'comment-whitespace-inside': 'always', } +/* + * Export + */ + export default { - ...possibleErrors, - ...limitLanguageFeatures, - ...stylisticIssues, + // Avoid Errors + ...descending, + ...duplicate, + ...empty, + ...invalid, + ...irregular, + ...missing, + ...nonStandard, + ...overrides, + ...unmatchable, + ...unknown, + // Enforce Conventions + ...allowedDisallowedAndRequired, + ...caseSensitive, + ...emptyLines, + ...maxAndMin, + ...notation, + ...pattern, + ...quotes, + ...redundant, + ...whitespaceInside, } From 3be5ccc472831acb51b255bbecf3e69c96b47cfa Mon Sep 17 00:00:00 2001 From: Patrick Taylor Date: Tue, 20 Aug 2024 00:02:20 +0100 Subject: [PATCH 10/11] =?UTF-8?q?Align=20configuration=20with=20popular=20?= =?UTF-8?q?presets=20=F0=9F=8F=98=EF=B8=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Presets; 1. `stylelint-config-standard-scss` 1.1. `stylelint-config-standard` 1.1.1. `stylelint-config-recommended` 1.2. `stylelint-config-recommended-scss` 1.2.1. `stylelint-config-recommended` Changes; - Disabled rules not relevant to SCSS/Sass. - Updated kebab-case regex pattern to allow numbers. - Improved messages for rules using regex patterns. - Support custom elements. --- config/stylelint.config.js | 6 ++++ config/stylelint/constants.ts | 2 +- config/stylelint/rules/scss.ts | 16 ++++++--- config/stylelint/rules/stylelint.ts | 50 ++++++++++++++++++++++------- 4 files changed, 57 insertions(+), 17 deletions(-) diff --git a/config/stylelint.config.js b/config/stylelint.config.js index f2760df..f2619d0 100644 --- a/config/stylelint.config.js +++ b/config/stylelint.config.js @@ -7,9 +7,15 @@ export default () => ({ overrides: [{ files: ['**/*.scss'], // TODO: Extend and make dry rules: { + 'annotation-no-unknown': null, 'at-rule-no-unknown': null, // scss/at-rule-no-unknown 'comment-no-empty': null, // scss/comment-no-empty 'function-no-unknown': null, // scss/function-no-unknown + 'import-notation': 'string', + 'media-query-no-invalid': null, + 'no-invalid-position-at-import-rule': [true, { + ignoreAtRules: ['use', 'forward'], + }], 'property-no-unknown': null, // scss/property-no-unknown ...Rules.DeclarationStrictValue, ...Rules.Scss, diff --git a/config/stylelint/constants.ts b/config/stylelint/constants.ts index 0126a60..2f7d194 100644 --- a/config/stylelint/constants.ts +++ b/config/stylelint/constants.ts @@ -1,6 +1,6 @@ const REGEX_PATTERNS = { HYPHENATED_BEM: '^[a-z]+(-[a-z]+)*(__[a-z]+)*$', - KEBAB: '^[a-z]+(-[a-z]+)*$', + KEBAB: '^[a-z][a-z0-9]*(-[a-z0-9]+)*$', } export { diff --git a/config/stylelint/rules/scss.ts b/config/stylelint/rules/scss.ts index 0ab8824..e30ce66 100644 --- a/config/stylelint/rules/scss.ts +++ b/config/stylelint/rules/scss.ts @@ -14,7 +14,9 @@ export default { // ignoreFunctions: [], // }], 'scss/at-function-parentheses-space-before': 'never', - 'scss/at-function-pattern': REGEX_PATTERNS.KEBAB, + 'scss/at-function-pattern': [REGEX_PATTERNS.KEBAB, { + message: 'Expected function name to be kebab-case', + }], 'scss/at-if-closing-brace-newline-after': 'always-last-in-chain', 'scss/at-if-closing-brace-space-after': 'always-intermediate', 'scss/at-if-no-null': true, @@ -26,7 +28,9 @@ export default { // }], 'scss/at-mixin-no-risky-nesting-selector': true, 'scss/at-mixin-parentheses-space-before': 'never', - 'scss/at-mixin-pattern': REGEX_PATTERNS.KEBAB, + 'scss/at-mixin-pattern': [REGEX_PATTERNS.KEBAB, { + message: 'Expected mixin name to be kebab-case', + }], 'scss/at-root-no-redundant': true, 'scss/at-rule-conditional-no-parentheses': true, 'scss/at-rule-no-unknown': true, @@ -58,7 +62,9 @@ export default { }], 'scss/dollar-variable-no-missing-interpolation': true, 'scss/dollar-variable-no-namespaced-assignment': true, - 'scss/dollar-variable-pattern': REGEX_PATTERNS.KEBAB, + 'scss/dollar-variable-pattern': [REGEX_PATTERNS.KEBAB, { + message: 'Expected variable name to be kebab-case', + }], 'scss/double-slash-comment-empty-line-before': ['always', { except: ['first-nested'], ignore: ['between-comments', 'stylelint-commands'], @@ -86,7 +92,9 @@ export default { 'scss/operator-no-newline-before': true, 'scss/operator-no-unspaced': true, 'scss/partial-no-import': true, - 'scss/percent-placeholder-pattern': REGEX_PATTERNS.KEBAB, + 'scss/percent-placeholder-pattern': [REGEX_PATTERNS.KEBAB, { + message: 'Expected placeholder name to be kebab-case', + }], 'scss/property-no-unknown': true, // 'scss/selector-nest-combinators': 'always', 'scss/selector-no-redundant-nesting-selector': true, diff --git a/config/stylelint/rules/stylelint.ts b/config/stylelint/rules/stylelint.ts index 981daa5..0f49e4b 100644 --- a/config/stylelint/rules/stylelint.ts +++ b/config/stylelint/rules/stylelint.ts @@ -12,7 +12,9 @@ const descending = { const duplicate = { 'declaration-block-no-duplicate-custom-properties': true, - 'declaration-block-no-duplicate-properties': true, + 'declaration-block-no-duplicate-properties': [true, { + ignore: ['consecutive-duplicates-with-different-syntaxes'], + }], 'font-family-no-duplicate-names': true, 'keyframe-block-no-duplicate-selectors': true, 'no-duplicate-at-import-rules': true, @@ -72,7 +74,9 @@ const unknown = { 'property-no-unknown': true, 'selector-pseudo-class-no-unknown': true, 'selector-pseudo-element-no-unknown': true, - 'selector-type-no-unknown': true, + 'selector-type-no-unknown': [true, { + ignore: ['custom-elements'], + }], 'unit-no-unknown': true, } @@ -102,7 +106,9 @@ const allowedDisallowedAndRequired = { 'function-url-no-scheme-relative': true, // 'function-url-scheme-allowed-list': [], // 'function-url-scheme-disallowed-list': [], - 'length-zero-no-unit': true, + 'length-zero-no-unit': [true, { + ignore: ['custom-properties'], + }], // 'media-feature-name-allowed-list': [], // 'media-feature-name-disallowed-list': [], 'media-feature-name-no-vendor-prefix': true, @@ -126,7 +132,9 @@ const allowedDisallowedAndRequired = { // 'selector-pseudo-element-disallowed-list': [], // 'unit-allowed-list': [], // 'unit-disallowed-list': [], - 'value-no-vendor-prefix': true, + 'value-no-vendor-prefix': [true, { + ignoreValues: ['box', 'inline-box'], + }], } const caseSensitive = { @@ -165,7 +173,7 @@ const maxAndMin = { ignore: ['blockless-at-rules', 'pseudo-classes'], ignoreAtRules: ['media'], }], - 'number-max-precision': 2, + 'number-max-precision': 3, 'selector-max-attribute': 2, 'selector-max-class': 3, 'selector-max-combinators': 3, @@ -179,14 +187,22 @@ const maxAndMin = { } const notation = { - 'alpha-value-notation': 'number', + 'alpha-value-notation': ['percentage', { + exceptProperties: [ + 'opacity', + 'fill-opacity', + 'flood-opacity', + 'stop-opacity', + 'stroke-opacity', + ], + }], 'color-function-notation': 'modern', 'color-hex-length': 'short', 'font-weight-notation': ['numeric', { ignore: ['relative'], }], 'hue-degree-notation': 'angle', - 'import-notation': 'string', + 'import-notation': 'url', 'keyframe-selector-notation': 'percentage-unless-within-keyword-only-block', 'lightness-notation': 'percentage', 'media-feature-range-notation': 'context', @@ -196,11 +212,21 @@ const notation = { const pattern = { // 'comment-pattern': '', - 'custom-media-pattern': REGEX_PATTERNS.KEBAB, - 'custom-property-pattern': REGEX_PATTERNS.KEBAB, - 'keyframes-name-pattern': REGEX_PATTERNS.KEBAB, - 'selector-class-pattern': REGEX_PATTERNS.HYPHENATED_BEM, - 'selector-id-pattern': REGEX_PATTERNS.KEBAB, + 'custom-media-pattern': [REGEX_PATTERNS.KEBAB, { + message: (name: string) => `Expected custom media query name "${name}" to be kebab-case`, + }], + 'custom-property-pattern': [REGEX_PATTERNS.KEBAB, { + message: (name: string) => `Expected custom property name "${name}" to be kebab-case`, + }], + 'keyframes-name-pattern': [REGEX_PATTERNS.KEBAB, { + message: (name: string) => `Expected keyframe name "${name}" to be kebab-case`, + }], + 'selector-class-pattern': [REGEX_PATTERNS.HYPHENATED_BEM, { + message: (selector: string) => `Expected class selector "${selector}" to be BEM hyphenated`, + }], + 'selector-id-pattern': [REGEX_PATTERNS.KEBAB, { + message: (selector: string) => `Expected id selector "${selector}" to be kebab-case`, + }], // 'selector-nested-pattern': '', } From 18bf18d660b61c8deb0e0ca0688c24161e2ad3eb Mon Sep 17 00:00:00 2001 From: Patrick Taylor Date: Tue, 20 Aug 2024 00:34:41 +0100 Subject: [PATCH 11/11] =?UTF-8?q?Added=20postcss-scss=20and=20postcss-less?= =?UTF-8?q?=20=F0=9F=8F=AD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- TODO | 15 ++++++++------- config/stylelint.config.js | 23 ++++++++++++++++++++--- package.json | 2 ++ src/__tests__/filePatterns.spec.ts | 2 +- src/filePatterns.ts | 2 +- yarn.lock | 10 ++++++++++ 6 files changed, 42 insertions(+), 12 deletions(-) diff --git a/TODO b/TODO index f4c400b..a41a54f 100644 --- a/TODO +++ b/TODO @@ -27,13 +27,14 @@ - [eslint-plugin-compat](https://github.com/amilajack/eslint-plugin-compat) - [eslint-plugin-json](https://github.com/azeemba/eslint-plugin-json) -## Stylelint Rules - -- [ ] stylelint-config-property-sort-order-smacss -- [ ] stylelint-config-standard-scss -- [ ] stylelint-declaration-strict-value -- [ ] stylelint-order -- [ ] stylelint-scss +## Stylelint Rules/Config + +- [x] @stylistic/stylelint-plugin +- [x] stylelint +- [x] stylelint-declaration-strict-value +- [x] stylelint-order +- [x] stylelint-scss +- [x] stylelint-config-property-sort-order-smacss ## Configuration Files diff --git a/config/stylelint.config.js b/config/stylelint.config.js index f2619d0..bd318d4 100644 --- a/config/stylelint.config.js +++ b/config/stylelint.config.js @@ -1,3 +1,6 @@ +import postcssLess from 'postcss-less' +import postcssScss from 'postcss-scss' + import Rules from './stylelint/rules' export default () => ({ @@ -5,7 +8,8 @@ export default () => ({ 'stylelint-config-property-sort-order-smacss', ], overrides: [{ - files: ['**/*.scss'], // TODO: Extend and make dry + customSyntax: postcssScss, + files: ['**/*.scss'], rules: { 'annotation-no-unknown': null, 'at-rule-no-unknown': null, // scss/at-rule-no-unknown @@ -17,17 +21,30 @@ export default () => ({ ignoreAtRules: ['use', 'forward'], }], 'property-no-unknown': null, // scss/property-no-unknown - ...Rules.DeclarationStrictValue, ...Rules.Scss, }, + plugins: [ + 'stylelint-scss', + ], + }, { + customSyntax: postcssLess, + files: ['**/*.less'], + rules: { + 'annotation-no-unknown': null, + 'import-notation': 'string', + 'media-query-no-invalid': null, + 'no-invalid-position-at-import-rule': [true, { + ignoreAtRules: ['use', 'forward'], + }], + }, }], plugins: [ '@stylistic/stylelint-plugin', 'stylelint-declaration-strict-value', 'stylelint-order', - 'stylelint-scss', ], rules: { + ...Rules.DeclarationStrictValue, ...Rules.Order, ...Rules.Stylelint, ...Rules.Stylistic, diff --git a/package.json b/package.json index 39e8345..b5848db 100644 --- a/package.json +++ b/package.json @@ -39,6 +39,8 @@ "markdownlint": "0.34.0", "markdownlint-rule-helpers": "0.25.0", "node-notifier": "10.0.1", + "postcss-less": "6.0.0", + "postcss-scss": "4.0.9", "space-log": "1.2.0", "stylelint": "16.8.1", "stylelint-config-property-sort-order-smacss": "10.0.0", diff --git a/src/__tests__/filePatterns.spec.ts b/src/__tests__/filePatterns.spec.ts index 50c950c..c41639f 100644 --- a/src/__tests__/filePatterns.spec.ts +++ b/src/__tests__/filePatterns.spec.ts @@ -63,7 +63,7 @@ describe('filePatterns', () => { const filePatterns = getFilePatterns({}) const expectedPatterns = [ - '**/*.{css,scss,less,sass,styl,stylus}', + '**/*.{css,scss,less}', ] expect(filePatterns.includePatterns[Linter.Stylelint]).toStrictEqual(expectedPatterns) diff --git a/src/filePatterns.ts b/src/filePatterns.ts index 3ac5d7e..43f3c1b 100644 --- a/src/filePatterns.ts +++ b/src/filePatterns.ts @@ -36,7 +36,7 @@ const getFilePatterns = ({ eslintInclude, ignoreDirs, ignorePatterns }: GetFileP includePatterns: { [Linter.ESLint]: eslintIncludePatterns, [Linter.Markdownlint]: ['**/*.{md,mdx}'], - [Linter.Stylelint]: ['**/*.{css,scss,less,sass,styl,stylus}'], + [Linter.Stylelint]: ['**/*.{css,scss,less}'], }, ignorePatterns: [ `**/+(${ignoreDirectories.join('|')})/**`, diff --git a/yarn.lock b/yarn.lock index ed92b79..c1e4973 100644 --- a/yarn.lock +++ b/yarn.lock @@ -4123,6 +4123,11 @@ pkg-dir@^4.2.0: dependencies: find-up "^4.0.0" +postcss-less@6.0.0: + version "6.0.0" + resolved "https://registry.yarnpkg.com/postcss-less/-/postcss-less-6.0.0.tgz#463b34c60f53b648c237f569aeb2e09149d85af4" + integrity sha512-FPX16mQLyEjLzEuuJtxA8X3ejDLNGGEG503d2YGZR5Ask1SpDN8KmZUMpzCvyalWRywAn1n1VOA5dcqfCLo5rg== + postcss-media-query-parser@^0.2.3: version "0.2.3" resolved "https://registry.yarnpkg.com/postcss-media-query-parser/-/postcss-media-query-parser-0.2.3.tgz#27b39c6f4d94f81b1a73b8f76351c609e5cef244" @@ -4138,6 +4143,11 @@ postcss-safe-parser@^7.0.0: resolved "https://registry.yarnpkg.com/postcss-safe-parser/-/postcss-safe-parser-7.0.0.tgz#6273d4e5149e286db5a45bc6cf6eafcad464014a" integrity sha512-ovehqRNVCpuFzbXoTb4qLtyzK3xn3t/CUBxOs8LsnQjQrShaB4lKiHoVqY8ANaC0hBMHq5QVWk77rwGklFUDrg== +postcss-scss@4.0.9: + version "4.0.9" + resolved "https://registry.yarnpkg.com/postcss-scss/-/postcss-scss-4.0.9.tgz#a03c773cd4c9623cb04ce142a52afcec74806685" + integrity sha512-AjKOeiwAitL/MXxQW2DliT28EKukvvbEWx3LBmJIRN8KfBGZbRTxNYW0kSqi1COiTZ57nZ9NW06S6ux//N1c9A== + postcss-selector-parser@^6.1.1: version "6.1.1" resolved "https://registry.yarnpkg.com/postcss-selector-parser/-/postcss-selector-parser-6.1.1.tgz#5be94b277b8955904476a2400260002ce6c56e38"