Make Stylelint lint HTML & HTML-like files (#140)

.vscode/settings.json

@@ -10,6 +10,16 @@
 	// Lint CSS with Stylelint
 	// Disable VS Code's built-in linters to prevent them from reporting the same errors as Stylelint
 	"stylelint.enable": true, // default
+	"stylelint.validate": [
+		"css", // default
+		"postcss", // default
+		"astro",
+		"html",
+		"php",
+		"svelte",
+		"vue",
+		"xml"
+	],
 	"css.validate": false,
 	"less.validate": false,
 	"scss.validate": false,

package.json

@@ -28,7 +28,7 @@
 		"format:check": "prettier --check .",
 		"lint": "npm run lint:css && npm run lint:js && npm run lint:md",
 		"lint:fix": "npm run lint:css:fix && npm run lint:js:fix && npm run lint:md:fix",
-		"lint:css": "stylelint \"**/*.css\"",
+		"lint:css": "stylelint --formatter verbose --max-warnings 0 \"**/*.{astro,css,html,php,svelte,vue,xml}\"",
 		"lint:css:fix": "npm run lint:css -- --fix",
 		"lint:js": "eslint --max-warnings 0",
 		"lint:js:fix": "npm run lint:js -- --fix",
@@ -38,7 +38,7 @@
 		"test": "npm run format:check && npm run lint"
 	},
 	"lint-staged": {
-		"*.css": [
+		"(*.astro|*.css|*.html|*.php|*.svelte|*.vue|*.xml)": [
 			"stylelint",
 			"prettier --write"
 		],
@@ -49,7 +49,7 @@
 		"*.md": [
 			"markdownlint-cli2 --fix"
 		],
-		"!(*.css|*.js|*.md)": [
+		"!(*.astro|*.css|*.html|*.js|*.md|*.php|*.svelte|*.vue|*.xml)": [
 			"prettier --write --ignore-unknown"
 		]
 	},
@@ -60,8 +60,10 @@
 		"husky": "9.1.6",
 		"lint-staged": "15.2.10",
 		"markdownlint-cli2": "0.15.0",
+		"postcss-html": "1.7.0",
 		"prettier": "3.3.3",
 		"stylelint": "16.10.0",
+		"stylelint-config-html": "1.1.0",
 		"stylelint-config-recess-order": "5.1.1",
 		"stylelint-config-standard": "36.0.1",
 		"stylelint-plugin-defensive-css": "1.0.4"

stylelint.config.js

@@ -3,6 +3,7 @@ export default {
 	extends: [
 		// Order matters: later configs take precedence over (override) earlier ones.
 		"stylelint-config-standard",
+		"stylelint-config-html",
 		"stylelint-config-recess-order",
 	],
 	plugins: ["stylelint-plugin-defensive-css"],