\u3053\u306e\u8a18\u4e8b\u3067\u308f\u304b\u308b\u3053\u3068<\/h3>\n\n\n

\n
• Markuplint\u306e\u6982\u8981\u3068\u3001ESLint\u3068\u306e\u9055\u3044<\/li>\n
• \u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\u624b\u9806\u3068\u30d5\u30ec\u30fc\u30e0\u30ef\u30fc\u30af\u5225\uff08React\/Vue\/Astro\/Svelte\uff09\u306e\u8a2d\u5b9a\u65b9\u6cd5<\/li>\n
• \u5168\u30eb\u30fc\u30eb\u306e\u89e3\u8aac\u30fb\u30a8\u30e9\u30fc\u30ec\u30d9\u30eb\u8a2d\u5b9a\u30fbignore\u30b3\u30e1\u30f3\u30c8\u306e\u4f7f\u3044\u65b9<\/li>\n
• VSCode\u62e1\u5f35\u30fbpre-commit\uff08husky+lint-staged\uff09\u30fbGitHub Actions\u3068\u306e\u9023\u643a\u65b9\u6cd5<\/li>\n
• \u30ab\u30b9\u30bf\u30e0\u30eb\u30fc\u30eb\u4f5c\u6210\u30fbMonorepo\u5bfe\u5fdc\u30fb\u65e2\u5b58\u30d7\u30ed\u30b8\u30a7\u30af\u30c8\u3078\u306e\u6bb5\u968e\u7684\u5c0e\u5165\u6226\u7565<\/li>\n<\/ul>\n\n<\/div><\/div>\n\n\n\n

  HTML\u306e\u54c1\u8cea\u3092\u30ec\u30d3\u30e5\u30fc\u306b\u4f9d\u5b58\u3057\u3066\u3044\u308b\u3068\u3001\u30ec\u30d3\u30e5\u30ef\u30fc\u306e\u30b9\u30ad\u30eb\u306b\u3088\u3063\u3066\u30c1\u30a7\u30c3\u30af\u7cbe\u5ea6\u306b\u3070\u3089\u3064\u304d\u304c\u51fa\u307e\u3059\u3002Markuplint\u306fHTML\u5c02\u7528\u306e\u30ea\u30f3\u30bf\u30fc\u3067\u3001\u30bf\u30b0\u306e\u6b63\u3057\u3044\u4f7f\u3044\u65b9\u30fbARIA\u30a2\u30af\u30bb\u30b7\u30d3\u30ea\u30c6\u30a3\u30fb\u898b\u51fa\u3057\u306e\u30a2\u30a6\u30c8\u30e9\u30a4\u30f3\u30fb\u5fc5\u9808\u5c5e\u6027\u306a\u3069\u3001\u81ea\u52d5\u3067\u30c1\u30a7\u30c3\u30af<\/strong>\u3057\u3066\u304f\u308c\u307e\u3059\u3002<\/p>\n\n\n\n

  \u672c\u8a18\u4e8b\u3067\u306f\u3001Markuplint\u306e\u6982\u8981\u30fb\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\u30fb\u5168\u30eb\u30fc\u30eb\u89e3\u8aac\u30fb\u30a8\u30e9\u30fc\u30ec\u30d9\u30eb\u306e\u8a2d\u5b9a\u30fbignore\u30b3\u30e1\u30f3\u30c8\u30fbReact\/Vue\/Astro\/Svelte\u5bfe\u5fdc\u30fbVSCode\u9023\u643a\u30fbpre-commit+lint-staged\u9023\u643a\u30fbGitHub Actions\u3067\u306e\u81ea\u52d5\u5316\u30fb\u30ab\u30b9\u30bf\u30e0\u30eb\u30fc\u30eb\u30fbmonorepo\u8a2d\u5b9a\u30fb\u65e2\u5b58PJ\u3078\u306e\u6bb5\u968e\u7684\u5c0e\u5165\u6226\u7565\u30fb\u3064\u307e\u305a\u304d\u3084\u3059\u3044\u30dd\u30a4\u30f3\u30c8<\/span><\/strong>\u3092\u5b8c\u5168\u89e3\u8aac\u3057\u307e\u3059\u3002<\/p>\n\n\n\n

  ---

  \n\n\n\n

  Markuplint\u3068\u306f\uff5cHTML\u5c02\u7528\u30ea\u30f3\u30bf\u30fc\u304c\u89e3\u6c7a\u3059\u308b\u554f\u984c<\/h2>\n\n\n\n

  Markuplint\u306f\u3001HTML\u306e\u69cb\u9020\u30fb\u30bb\u30de\u30f3\u30c6\u30a3\u30af\u30b9\u30fb\u30a2\u30af\u30bb\u30b7\u30d3\u30ea\u30c6\u30a3\u3092\u81ea\u52d5\u691c\u8a3c\u3059\u308bHTML\u5c02\u7528\u30ea\u30f3\u30bf\u30fc\u3067\u3059\u3002JavaScript\u3092\u5bfe\u8c61\u3068\u3059\u308bESLint\u3068\u306f\u5f79\u5272\u304c\u7570\u306a\u308a\u3001\u4e21\u8005\u3092\u7d44\u307f\u5408\u308f\u305b\u3066\u4f7f\u3046\u306e\u304c\u7406\u60f3\u7684\u3067\u3059\u3002<\/p>\n\n\n

  >\u3010Markuplint\u304c\u81ea\u52d5\u30c1\u30a7\u30c3\u30af\u3059\u308b\u5185\u5bb9\u3011\n\n\u2705 HTML\u30bf\u30b0\u306e\u6b63\u3057\u3044\u4f7f\u3044\u65b9\uff08\u69cb\u9020\u30c1\u30a7\u30c3\u30af\uff09\n\u2192 <p>\u306e\u4e2d\u306b<div>\u306f\u5165\u308c\u3089\u308c\u306a\u3044\uff08\u30a4\u30f3\u30e9\u30a4\u30f3\u8981\u7d20\u306e\u89aa\u306b\u30d6\u30ed\u30c3\u30af\u8981\u7d20\uff09\n\u2192 <li>\u306f<ul>\/<ol>\u306e\u76f4\u4e0b\u306b\u306e\u307f\u7f6e\u3051\u308b\n\u2192 <table>\u306e\u69cb\u9020\u30c1\u30a7\u30c3\u30af\uff08<thead>\/<tbody>\/<tr>\/<td>\u306e\u6b63\u3057\u3044\u914d\u7f6e\uff09\n\u2192 \u7a7a\u8981\u7d20\uff08<img>\/<input>\uff09\u306e\u8aa4\u3063\u305f\u9589\u3058\u30bf\u30b0\n\n\u2705 \u30a2\u30af\u30bb\u30b7\u30d3\u30ea\u30c6\u30a3\uff08ARIA\u5c5e\u6027\uff09\n\u2192 <img>\u306ealt\u5c5e\u6027\u304c\u8a2d\u5b9a\u3055\u308c\u3066\u3044\u308b\u304b\n\u2192 aria-label\/aria-labelledby\u306e\u6b63\u3057\u3044\u4f7f\u3044\u65b9\n\u2192 <button>\u306b\u30a2\u30af\u30bb\u30b7\u30d6\u30eb\u306a\u540d\u524d\u304c\u3042\u308b\u304b\n\u2192 \u30a4\u30f3\u30bf\u30e9\u30af\u30c6\u30a3\u30d6\u8981\u7d20\u306e\u9069\u5207\u306arole\n\n\u2705 \u898b\u51fa\u3057\u306e\u30a2\u30a6\u30c8\u30e9\u30a4\u30f3\uff08heading-levels\uff09\n\u2192 h1 \u2192 h2 \u2192 h3 \u306e\u6b63\u3057\u3044\u9806\u5e8f\u3067\u4f7f\u308f\u308c\u3066\u3044\u308b\u304b\n\u2192 h1 \u3092\u98db\u3070\u3057\u3066 h3 \u3092\u4f7f\u3063\u3066\u3044\u306a\u3044\u304b\n\u2192 \u30da\u30fc\u30b8\u306bh1\u304c1\u3064\u3060\u3051\u5b58\u5728\u3059\u308b\u304b\n\n\u2705 \u5fc5\u9808\u5c5e\u6027\u30c1\u30a7\u30c3\u30af\uff08required-attr\uff09\n\u2192 <img>\u306bwidth\u30fbheight\u304c\u3042\u308b\u304b\uff08Core Web Vitals\u5bfe\u7b56\uff09\n\u2192 <a>\u306bhref\u304c\u3042\u308b\u304b\n\u2192 <input>\u306bid\u5c5e\u6027\u304c\u3042\u308b\u304b\n\n\u2705 \u305d\u306e\u4ed6\u306e\u30c1\u30a7\u30c3\u30af\n\u2192 attr-duplication: \u91cd\u8907\u5c5e\u6027\u30c1\u30a7\u30c3\u30af\n\u2192 no-boolean-attr-value: boolean\u5c5e\u6027\u306e\u5024\u306e\u4e0d\u8981\u306a\u8a18\u8ff0\n\u2192 case-sensitive-attr-name: \u5c5e\u6027\u540d\u306e\u5927\u6587\u5b57\u5c0f\u6587\u5b57\u30c1\u30a7\u30c3\u30af\n\u2192 character-reference: \u6587\u5b57\u53c2\u7167\u306e\u6b63\u3057\u3044\u4f7f\u3044\u65b9\n\n\u3010ESLint\u3068\u306e\u9055\u3044\u3011\nESLint: JavaScript\/TypeScript\u306e\u69cb\u6587\u30fb\u30b9\u30bf\u30a4\u30eb\u3092\u30c1\u30a7\u30c3\u30af\nMarkuplint: HTML\u306e\u69cb\u9020\u30fb\u30bb\u30de\u30f3\u30c6\u30a3\u30af\u30b9\u30fb\u30a2\u30af\u30bb\u30b7\u30d3\u30ea\u30c6\u30a3\u306b\u7279\u5316\n\u2192 \u4e21\u65b9\u3092\u7d44\u307f\u5408\u308f\u305b\u3066\u4f7f\u3046\u306e\u304c\u7406\u60f3\u7684<\/code><\/pre><\/div>\n\n\n
  \n\n\n\n
  \u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\u3068\u57fa\u672c\u8a2d\u5b9a<\/h2>\n\n\n
  ># Markuplint\u672c\u4f53\u306e\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\nnpm install --save-dev markuplint\n\n# \u5bfe\u8a71\u5f0f\u521d\u671f\u8a2d\u5b9a\u30b3\u30de\u30f3\u30c9\uff08\u63a8\u5968\uff1a\u81ea\u52d5\u3067\u5fc5\u8981\u306a\u30d1\u30c3\u30b1\u30fc\u30b8\u3092\u9078\u629e\u30fb\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\uff09\nnpx markuplint --init\n# \u2192 \u30d5\u30ec\u30fc\u30e0\u30ef\u30fc\u30af\u306e\u9078\u629e\uff08React\/Vue\/Svelte\/Astro\u7b49\uff09\n# \u2192 \u8a2d\u5b9a\u30d5\u30a1\u30a4\u30eb\u306e\u5f62\u5f0f\uff08JSON\/YAML\/JavaScript\uff09\n# \u2192 \u4f7f\u7528\u3059\u308b\u30d7\u30ea\u30bb\u30c3\u30c8\u30eb\u30fc\u30eb\n# \u2192 \u5fc5\u8981\u306a\u30d1\u30c3\u30b1\u30fc\u30b8\u3092\u81ea\u52d5\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb<\/code><\/pre><\/div>\n\n\n
  \u624b\u52d5\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\uff08\u30d5\u30ec\u30fc\u30e0\u30ef\u30fc\u30af\u5225\uff09<\/h3>\n\n\n
  ># React \/ Next.js (JSX\/TSX) \u5bfe\u5fdc\nnpm install --save-dev markuplint @markuplint\/jsx-parser @markuplint\/react-spec\n\n# Vue.js (.vue) \u5bfe\u5fdc\nnpm install --save-dev markuplint @markuplint\/vue-parser @markuplint\/vue-spec\n\n# Astro (.astro) \u5bfe\u5fdc\nnpm install --save-dev markuplint @markuplint\/astro-parser\n\n# Svelte (.svelte) \u5bfe\u5fdc\nnpm install --save-dev markuplint @markuplint\/svelte-parser\n\n# Pug (.pug) \u5bfe\u5fdc\nnpm install --save-dev markuplint @markuplint\/pug-parser\n\n# WordPress \/ EJS (.php) \u5bfe\u5fdc\n# HTML\u30d1\u30fc\u30b5\u30fc\u304c\u30c7\u30d5\u30a9\u30eb\u30c8\u3067\u5bfe\u5fdc\uff08\u8ffd\u52a0\u4e0d\u8981\uff09<\/code><\/pre><\/div>\n\n\n
  \n\n\n\n
  \u8a2d\u5b9a\u30d5\u30a1\u30a4\u30eb\u8a73\u89e3\uff5c.markuplintrc \u306e\u5168\u30aa\u30d7\u30b7\u30e7\u30f3<\/h2>\n\n\n\n
  \u57fa\u672c\u7684\u306a\u8a2d\u5b9a\u30d5\u30a1\u30a4\u30eb\uff08HTML\u5c02\u7528\u30d7\u30ed\u30b8\u30a7\u30af\u30c8\uff09<\/h3>\n\n\n
  >{\n  \"$schema\": \"https:\/\/raw.githubusercontent.com\/markuplint\/markuplint\/main\/packages\/markuplint\/schemas\/markuplintrc.json\",\n\n  \/\/ \u30d7\u30ea\u30bb\u30c3\u30c8\u3092\u7d99\u627f\uff08\u63a8\u5968\u30d7\u30ea\u30bb\u30c3\u30c8\uff09\n  \"extends\": [\"markuplint:recommended\"],\n\n  \"rules\": {\n    \/\/ ===== \u69cb\u9020\u30c1\u30a7\u30c3\u30af =====\n\n    \/\/ aria-*\u5c5e\u6027\u306e\u6b63\u3057\u3044\u4f7f\u3044\u65b9\u3092\u691c\u8a3c\n    \"invalid-attr\": true,\n\n    \/\/ \u8981\u7d20\u306e\u30b3\u30f3\u30c6\u30f3\u30c4\u30e2\u30c7\u30eb\u306b\u9055\u53cd\u3059\u308b\u5b50\u8981\u7d20\u3092\u691c\u51fa\n    \/\/ \u4f8b: <p>\u306e\u4e2d\u306b<div>\u304c\u542b\u307e\u308c\u308b\n    \"required-attr\": true,\n\n    \/\/ \u540c\u3058\u5c5e\u6027\u540d\u306e\u91cd\u8907\u3092\u691c\u51fa\n    \"attr-duplication\": true,\n\n    \/\/ boolean\u5c5e\u6027\u306b\u4e0d\u8981\u306a\u5024\u304c\u8a18\u8ff0\u3055\u308c\u3066\u3044\u308b\n    \/\/ \u00d7: <input disabled=\"disabled\"> \u2192 \u2705: <input disabled>\n    \"no-boolean-attr-value\": true,\n\n    \/\/ ===== \u30a2\u30af\u30bb\u30b7\u30d3\u30ea\u30c6\u30a3\u30c1\u30a7\u30c3\u30af =====\n\n    \/\/ ARIA\u30ed\u30fc\u30eb\u306e\u4e0d\u6b63\u306a\u4f7f\u3044\u65b9\u3092\u691c\u51fa\n    \"wai-aria\": true,\n\n    \/\/ label \u3068 input \u306e\u95a2\u9023\u4ed8\u3051\u3092\u691c\u8a3c\n    \"label-has-control\": true,\n\n    \/\/ \u30e9\u30f3\u30c9\u30de\u30fc\u30af\u306e\u30e9\u30d9\u30eb\u4ed8\u3051\u3092\u691c\u8a3c\n    \"landmark-roles\": true,\n\n    \/\/ \u898b\u51fa\u3057\u30ec\u30d9\u30eb\u306e\u30b9\u30ad\u30c3\u30d7\u3092\u691c\u51fa\uff08h1 \u2192 h3 \u306e\u30b8\u30e3\u30f3\u30d7\u7b49\uff09\n    \"heading-levels\": {\n      \"severity\": \"error\",\n      \"options\": {\n        \"minLevel\": 1,\n        \"allowMultipleH1\": false\n      }\n    },\n\n    \/\/ ===== \u30d1\u30d5\u30a9\u30fc\u30de\u30f3\u30b9\u30fb\u54c1\u8cea\u30c1\u30a7\u30c3\u30af =====\n\n    \/\/ <img>\u306ewidth\/height\u5c5e\u6027\uff08Core Web Vitals\u5bfe\u7b56\uff09\n    \"required-attr\": {\n      \"options\": {\n        \"attrs\": {\n          \"img\": [\"src\", \"alt\", \"width\", \"height\"]\n        }\n      }\n    },\n\n    \/\/ \u7a7a\u306e\u8981\u7d20\u3092\u691c\u51fa\uff08<p><\/p> \u306a\u3069\uff09\n    \"no-empty-palpable-content\": true,\n\n    \/\/ \u5927\u6587\u5b57\u5c0f\u6587\u5b57\u306e\u4e00\u8cab\u6027\n    \"case-sensitive-attr-name\": true,\n\n    \/\/ ===== \u30b9\u30bf\u30a4\u30eb\u8a2d\u5b9a =====\n\n    \/\/ \u30d5\u30a1\u30a4\u30eb\u306e\u30a8\u30f3\u30b3\u30fc\u30c7\u30a3\u30f3\u30b0\u5ba3\u8a00\n    \"charset\": true\n  }\n}<\/code><\/pre><\/div>\n\n\n
  React \/ Next.js\uff08JSX\/TSX\uff09\u5411\u3051\u8a2d\u5b9a<\/h3>\n\n\n
  >{\n  \"$schema\": \"https:\/\/raw.githubusercontent.com\/markuplint\/markuplint\/main\/packages\/markuplint\/schemas\/markuplintrc.json\",\n\n  \/\/ React\u63a8\u5968\u30d7\u30ea\u30bb\u30c3\u30c8\u3092\u4f7f\u7528\n  \"extends\": [\"markuplint:recommended-react\"],\n\n  \/\/ \u30d5\u30a1\u30a4\u30eb\u7a2e\u5225\u3068\u30d1\u30fc\u30b5\u30fc\u306e\u30de\u30c3\u30d4\u30f3\u30b0\n  \"parser\": {\n    \"\\\\.jsx$\": \"@markuplint\/jsx-parser\",\n    \"\\\\.tsx$\": \"@markuplint\/jsx-parser\"\n  },\n\n  \/\/ \u30d5\u30a1\u30a4\u30eb\u7a2e\u5225\u3068\u30b9\u30da\u30c3\u30af\u306e\u30de\u30c3\u30d4\u30f3\u30b0\n  \"specs\": {\n    \"\\\\.jsx$\": \"@markuplint\/react-spec\",\n    \"\\\\.tsx$\": \"@markuplint\/react-spec\"\n  },\n\n  \"rules\": {\n    \"invalid-attr\": {\n      \"options\": {\n        \/\/ \u30ab\u30b9\u30bf\u30e0\u5c5e\u6027\u30d7\u30ec\u30d5\u30a3\u30c3\u30af\u30b9\u306e\u7121\u8996\n        \"ignoreAttrNamePrefix\": [\n          \"css\",      \/\/ CSS Modules: css={{ ... }}\n          \"data-\",    \/\/ HTML data\u5c5e\u6027\n          \"aria-\",    \/\/ ARIA\u306f\u30b9\u30da\u30c3\u30af\u3067\u5225\u9014\u7ba1\u7406\n          \"x-\"        \/\/ \u30d5\u30ec\u30fc\u30e0\u30ef\u30fc\u30af\u56fa\u6709\u5c5e\u6027\n        ]\n      }\n    },\n    \"required-attr\": true,\n    \"heading-levels\": true,\n    \"wai-aria\": true,\n\n    \/\/ JSX\u3067\u306f className \u3092\u4f7f\u3046\u305f\u3081 class \u306e\u30c1\u30a7\u30c3\u30af\u3092\u8abf\u6574\n    \"no-use-event-handler-attr\": false\n  },\n\n  \/\/ \u7279\u5b9a\u30d5\u30a1\u30a4\u30eb\u30fb\u30c7\u30a3\u30ec\u30af\u30c8\u30ea\u3092\u9664\u5916\n  \"excludeFiles\": [\n    \"node_modules\/**\",\n    \".next\/**\",\n    \"out\/**\",\n    \"coverage\/**\"\n  ]\n}<\/code><\/pre><\/div>\n\n\n
  \n\n\n\n
  \u5168\u30eb\u30fc\u30eb\u89e3\u8aac\uff5c\u30ab\u30c6\u30b4\u30ea\u5225\u4e00\u89a7<\/h2>\n\n\n\n
  Markuplint\u306e\u30eb\u30fc\u30eb\u306f\u5927\u304d\u304f\u300c\u69cb\u9020\u7cfb\u300d\u300c\u30a2\u30af\u30bb\u30b7\u30d3\u30ea\u30c6\u30a3\u7cfb\u300d\u300c\u30b3\u30f3\u30c6\u30f3\u30c4\u54c1\u8cea\u7cfb\u300d\u306e3\u30ab\u30c6\u30b4\u30ea\u306b\u5206\u985e\u3067\u304d\u307e\u3059\u3002<\/p>\n\n\n
  \u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\n\u3010\u69cb\u9020\u7cfb\u30eb\u30fc\u30eb\u3011\n\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\n\n\u25a0 invalid-attr\n  HTML\u4ed5\u69d8\u306b\u5b58\u5728\u3057\u306a\u3044\u5c5e\u6027\u30fb\u5024\u306e\u578b\u9055\u53cd\u3092\u691c\u51fa\n  \u4f8b: <div hoge=\"test\"> \u2192 'hoge'\u306f\u7121\u52b9\u306a\u5c5e\u6027\n\n\u25a0 attr-duplication\n  \u540c\u3058\u5c5e\u6027\u3092\u91cd\u8907\u3057\u3066\u8a18\u8ff0\u3057\u305f\u5834\u5408\u306b\u691c\u51fa\n  \u4f8b: <div class=\"foo\" class=\"bar\"> \u2192 \u91cd\u8907\u30a8\u30e9\u30fc\n\n\u25a0 no-boolean-attr-value\n  boolean\u5c5e\u6027\u306b\u4e0d\u8981\u306a\u5024\u304c\u8a18\u8ff0\u3055\u308c\u3066\u3044\u308b\u5834\u5408\u306b\u691c\u51fa\n  \u00d7: <input disabled=\"disabled\"> \u2192 \u2705: <input disabled>\n\n\u25a0 case-sensitive-attr-name\n  \u5c5e\u6027\u540d\u306e\u5927\u6587\u5b57\u6df7\u5728\u3092\u691c\u51fa\n  \u4f8b: <div Class=\"foo\"> \u2192 'class'\u304c\u6b63\u3057\u3044\n\n\u25a0 character-reference\n  \u6587\u5b57\u53c2\u7167\u306e\u30a8\u30e9\u30fc\uff08& \u306e\u4ee3\u308f\u308a\u306b & \u3092\u76f4\u63a5\u4f7f\u7528\u306a\u3069\uff09\n\n\u25a0 no-refer-to-non-existent-id\n  aria-labelledby\u3084for\u5c5e\u6027\u3067\u53c2\u7167\u3059\u308bID\u304c\u5b58\u5728\u3057\u306a\u3044\u5834\u5408\u306b\u691c\u51fa\n\n\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\n\u3010\u30a2\u30af\u30bb\u30b7\u30d3\u30ea\u30c6\u30a3\u7cfb\u30eb\u30fc\u30eb\u3011\n\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\n\n\u25a0 wai-aria\n  ARIA\u30ed\u30fc\u30eb\u30fb\u30b9\u30c6\u30fc\u30c8\u30fb\u30d7\u30ed\u30d1\u30c6\u30a3\u306e\u6b63\u3057\u3044\u4f7f\u3044\u65b9\u3092\u691c\u8a3c\n  \u4f8b: <div role=\"button\"> \u2190 role=button\u306b\u306f focusable \u304c\u5fc5\u8981\n\n\u25a0 heading-levels\n  \u898b\u51fa\u3057\u30ec\u30d9\u30eb\u306e\u30b9\u30ad\u30c3\u30d7\u3092\u691c\u51fa\uff08h1\u2192h3\u306e\u30b8\u30e3\u30f3\u30d7\u7b49\uff09\n  \u4f8b: h1\u306e\u5f8c\u306bh3\u304c\u6765\u308b\u3068\u30a8\u30e9\u30fc\n\n\u25a0 label-has-control\n  <label>\u8981\u7d20\u304c\u30d5\u30a9\u30fc\u30e0\u30b3\u30f3\u30c8\u30ed\u30fc\u30eb\u3068\u6b63\u3057\u304f\u95a2\u9023\u4ed8\u3051\u3089\u308c\u3066\u3044\u308b\u304b\u691c\u8a3c\n  \u4f8b: for\u5c5e\u6027\u304c\u5b58\u5728\u3059\u308binput\u306eid\u3068\u4e00\u81f4\u3057\u3066\u3044\u308b\u304b\n\n\u25a0 landmark-roles\n  \u30e9\u30f3\u30c9\u30de\u30fc\u30af\u8981\u7d20\uff08nav\u3001main\u3001header\u7b49\uff09\u306e\u9069\u5207\u306a\u4f7f\u7528\u3092\u30c1\u30a7\u30c3\u30af\n  \u4f8b: <nav> \u304c\u8907\u6570\u3042\u308b\u5834\u5408\u306faria-label\u3067\u533a\u5225\u304c\u5fc5\u8981\n\n\u25a0 no-abstract-roles\n  \u62bd\u8c61\u7684\u306aARIA\u30ed\u30fc\u30eb\uff08composite, landmark\u7b49\uff09\u306e\u4f7f\u7528\u3092\u7981\u6b62\n  \u4f8b: <div role=\"landmark\"> \u2192 \u62bd\u8c61\u30ed\u30fc\u30eb\u306f\u76f4\u63a5\u4f7f\u7528\u4e0d\u53ef\n\n\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\n\u3010\u30b3\u30f3\u30c6\u30f3\u30c4\u54c1\u8cea\u7cfb\u3011\n\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\n\n\u25a0 required-attr\n  \u8981\u7d20\u306b\u5fc5\u9808\u3068\u3055\u308c\u308b\u5c5e\u6027\u304c\u6b20\u843d\u3057\u3066\u3044\u308b\u5834\u5408\u306b\u691c\u51fa\n  \u4f8b: <img>\u306balt\u30fbwidth\u30fbheight\u304c\u306a\u3044\n\n\u25a0 no-empty-palpable-content\n  \u77e5\u899a\u53ef\u80fd\u306a\u30b3\u30f3\u30c6\u30f3\u30c4\u304c\u306a\u3044\u8981\u7d20\u3092\u691c\u51fa\n  \u4f8b: <p><\/p>\u3001<li><\/li>\n\n\u25a0 deprecated-element\n  \u5ec3\u6b62\u3055\u308c\u305f\u8981\u7d20\u306e\u4f7f\u7528\u3092\u691c\u51fa\n  \u4f8b: <center>\u3001<font>\u3001<marquee>\n\n\u25a0 no-use-event-handler-attr\n  onclick\u306a\u3069\u306e\u30a4\u30d9\u30f3\u30c8\u30cf\u30f3\u30c9\u30e9\u5c5e\u6027\u306e\u76f4\u63a5\u8a18\u8ff0\u3092\u7981\u6b62\n  \u4f8b: <button onclick=\"fn()\"> \u2192 JS\u3067 addEventListener \u3092\u4f7f\u3046<\/code><\/pre><\/div>\n\n\n
  \n\n\n\n
  \u30a8\u30e9\u30fc\u30ec\u30d9\u30eb\u306e\u8a2d\u5b9a\uff5cerror \/ warning \/ false \u306e\u4f7f\u3044\u5206\u3051<\/h2>\n\n\n\n
  Markuplint\u3067\u306f\u30eb\u30fc\u30eb\u3054\u3068\u306b\u30a8\u30e9\u30fc\u30ec\u30d9\u30eb\u3092\u8a2d\u5b9a\u3067\u304d\u307e\u3059\u3002\u65e2\u5b58\u30d7\u30ed\u30b8\u30a7\u30af\u30c8\u3078\u306e\u5c0e\u5165\u6642\u306f\u307e\u305awarning<\/code>\u306b\u3057\u3066\u3001\u5f90\u3005\u306berror<\/code>\u306b\u6607\u683c\u3055\u305b\u308b\u6226\u7565\u304c\u52b9\u679c\u7684\u3067\u3059\u3002<\/p>\n\n\n\n
  \n
  \u8a2d\u5b9a\u5024<\/th>
  \u52d5\u4f5c<\/th>
  \u63a8\u5968\u30b7\u30fc\u30f3<\/th><\/tr><\/thead>
  true<\/code> \/ \"error\"<\/code><\/td>
  \u30a8\u30e9\u30fc\u3068\u3057\u3066\u691c\u51fa\u30fbCI\u3092\u30d6\u30ed\u30c3\u30af<\/td>
  \u5fc5\u305a\u5b88\u308b\u3079\u304d\u30eb\u30fc\u30eb<\/td><\/tr>\n
  \"warning\"<\/code><\/td>
  \u8b66\u544a\u3068\u3057\u3066\u8868\u793a\u30fbCI\u306f\u30d6\u30ed\u30c3\u30af\u3057\u306a\u3044<\/td>
  \u5c0e\u5165\u521d\u671f\u30fb\u5f90\u3005\u306b\u79fb\u884c\u3059\u308b\u30eb\u30fc\u30eb<\/td><\/tr>\n
  false<\/code><\/td>
  \u30eb\u30fc\u30eb\u7121\u52b9<\/td>
  \u30d7\u30ed\u30b8\u30a7\u30af\u30c8\u306b\u5408\u308f\u306a\u3044\u30eb\u30fc\u30eb<\/td><\/tr>\n<\/tbody><\/table><\/figure>\n\n\n
  >{\n  \"rules\": {\n    \/\/ \u30a8\u30e9\u30fc: CI\u3092\u30d6\u30ed\u30c3\u30af\u3059\u308b\u91cd\u5927\u306a\u30eb\u30fc\u30eb\n    \"heading-levels\": {\n      \"severity\": \"error\"\n    },\n\n    \/\/ \u8b66\u544a: \u8868\u793a\u306f\u3059\u308b\u304c\u901a\u904e\u3055\u305b\u308b\uff08\u5c0e\u5165\u521d\u671f\uff09\n    \"wai-aria\": {\n      \"severity\": \"warning\"\n    },\n\n    \/\/ \u7121\u52b9: \u3053\u306e\u30d7\u30ed\u30b8\u30a7\u30af\u30c8\u3067\u306f\u4f7f\u308f\u306a\u3044\u30eb\u30fc\u30eb\n    \"no-use-event-handler-attr\": false\n  }\n}<\/code><\/pre><\/div>\n\n\n
  \n\n\n\n
  ignore\u30b3\u30e1\u30f3\u30c8\u306e\u4f7f\u3044\u65b9<\/h2>\n\n\n\n
  \u30b5\u30fc\u30c9\u30d1\u30fc\u30c6\u30a3\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u3084\u907f\u3051\u3089\u308c\u306a\u3044\u69cb\u9020\u3067\u306f\u3001ignore\u30b3\u30e1\u30f3\u30c8\u3067\u7279\u5b9a\u884c\u30fb\u7279\u5b9a\u30eb\u30fc\u30eb\u3092\u7121\u52b9\u5316\u3067\u304d\u307e\u3059\u3002<\/p>\n\n\n
  <!-- markuplint-disable heading-levels -->\n<h3>\u30b5\u30fc\u30c9\u30d1\u30fc\u30c6\u30a3\u30a6\u30a3\u30b8\u30a7\u30c3\u30c8\u5185\u306e\u898b\u51fa\u3057<\/h3>\n<!-- markuplint-enable heading-levels -->\n\n<!-- 1\u884c\u3060\u3051\u7121\u52b9\u306b\u3059\u308b\u5834\u5408 -->\n<!-- markuplint-disable-next-line wai-aria -->\n<div role=\"tooltip\" aria-hidden=\"true\">...<\/div>\n\n<!-- \u5168\u30eb\u30fc\u30eb\u3092\u7121\u52b9\u306b\u3059\u308b\uff08\u975e\u63a8\u5968\u30fb\u6700\u5c0f\u7bc4\u56f2\u3067\u4f7f\u3046\uff09 -->\n<!-- markuplint-disable -->\n...\n<!-- markuplint-enable --><\/code><\/pre><\/div>\n\n\n
  \n\n\n\n
  VSCode\u62e1\u5f35\u6a5f\u80fd\u3068\u306e\u9023\u643a<\/h2>\n\n\n
  >\u3010VSCode Markuplint \u62e1\u5f35\u6a5f\u80fd\u306e\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\u3011\n\n1. VSCode\u3092\u958b\u304f\n2. \u62e1\u5f35\u6a5f\u80fd\uff08Ctrl+Shift+X\uff09\u3067\u300cMarkuplint\u300d\u3092\u691c\u7d22\n3. \u516c\u5f0f\u306e\u300cMarkuplint\u300d\u3092\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\n   \u2192 \u767a\u884c\u8005: markuplint\n\n\u3010\u52d5\u4f5c\u78ba\u8a8d\u3011\n- .markuplintrc \u304c\u5b58\u5728\u3059\u308b\u30d7\u30ed\u30b8\u30a7\u30af\u30c8\u3067 HTML\/JSX\/Vue \u7b49\u3092\u958b\u304f\n- \u30a8\u30e9\u30fc\u7b87\u6240\u304c\u8d64\u6ce2\u7dda\u3067\u8868\u793a\u3055\u308c\u3001Problems \u30d1\u30cd\u30eb\u306b\u30a8\u30e9\u30fc\u5185\u5bb9\u304c\u51fa\u308b\n- \u30db\u30d0\u30fc\u3059\u308b\u3068\u8a72\u5f53\u30eb\u30fc\u30eb\u306e\u8aac\u660e\u3068\u4fee\u6b63\u30d2\u30f3\u30c8\u304c\u8868\u793a\u3055\u308c\u308b\n\n\u3010settings.json \u63a8\u5968\u8a2d\u5b9a\u3011\n{\n  \"editor.formatOnSave\": true,\n  \"\": {\n    \"editor.defaultFormatter\": \"esbenp.prettier-vscode\"\n  },\n  \"markuplint.enable\": true,\n  \"markuplint.debug.enable\": false\n}<\/code><\/pre><\/div>\n\n\n
  \n\n\n\n
  pre-commit\u9023\u643a\uff5chusky + lint-staged \u306e\u8a2d\u5b9a<\/h2>\n\n\n\n
  \u30b3\u30df\u30c3\u30c8\u6642\u306bMarkuplint\u3092\u81ea\u52d5\u5b9f\u884c\u3059\u308b\u3053\u3068\u3067\u3001\u4e0d\u6b63\u306aHTML\u304c\u30ea\u30dd\u30b8\u30c8\u30ea\u306b\u5165\u308a\u8fbc\u3080\u3053\u3068\u3092\u9632\u3052\u307e\u3059\u3002<\/p>\n\n\n
  ># husky \u3068 lint-staged \u306e\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\nnpm install --save-dev husky lint-staged\n\n# husky\u306e\u521d\u671f\u5316\nnpx husky init\n\n# .husky\/pre-commit \u306b\u4ee5\u4e0b\u3092\u8a18\u8ff0\nnpx lint-staged<\/code><\/pre><\/div>\n\n
  \/\/ package.json \u306b lint-staged \u306e\u8a2d\u5b9a\u3092\u8ffd\u52a0\n{\n  \"lint-staged\": {\n    \"*.{html,jsx,tsx,vue,astro,svelte}\": [\n      \"markuplint --fix\",\n      \"prettier --write\"\n    ]\n  }\n}<\/code><\/pre><\/div>\n\n\n
  \n\n\n\n
  GitHub Actions\u3067\u306e\u81ea\u52d5\u5316<\/h2>\n\n\n\n
  PR\u306eHTML\u5909\u66f4\u306b\u5bfe\u3057\u3066Markuplint\u3092\u81ea\u52d5\u5b9f\u884c\u3057\u3001\u30a8\u30e9\u30fc\u304c\u3042\u308c\u3070\u30de\u30fc\u30b8\u3092\u30d6\u30ed\u30c3\u30af\u3067\u304d\u307e\u3059\u3002<\/p>\n\n\n
  # .github\/workflows\/markuplint.yml\nname: Markuplint\n\non:\n  pull_request:\n    paths:\n      - '**\/*.html'\n      - '**\/*.jsx'\n      - '**\/*.tsx'\n      - '**\/*.vue'\n      - '**\/*.astro'\n      - '**\/*.svelte'\n\njobs:\n  markuplint:\n    runs-on: ubuntu-latest\n    steps:\n      - uses: actions\/checkout@v4\n      - uses: actions\/setup-node@v4\n        with:\n          node-version: '20'\n          cache: 'npm'\n      - run: npm ci\n      - name: Run Markuplint\n        run: npx markuplint \"src\/**\/*.{html,jsx,tsx,vue,astro,svelte}\"<\/code><\/pre><\/div>\n\n\n
  \n\n\n\n
  Monorepo\u5bfe\u5fdc\uff5c\u30eb\u30fc\u30c8\u5171\u901a\u8a2d\u5b9a\u3068\u5404\u30a2\u30d7\u30ea\u56fa\u6709\u8a2d\u5b9a<\/h2>\n\n\n
  # Monorepo\u306e\u30c7\u30a3\u30ec\u30af\u30c8\u30ea\u69cb\u6210\u4f8b\nroot\/\n\u251c\u2500\u2500 .markuplintrc.json  \u2190 \u5171\u901a\u8a2d\u5b9a\uff08\u5168\u30a2\u30d7\u30ea\u5171\u901a\u30eb\u30fc\u30eb\uff09\n\u251c\u2500\u2500 apps\/\n\u2502   \u251c\u2500\u2500 web\/          \u2190 Next.js (TSX)\n\u2502   \u2502   \u2514\u2500\u2500 .markuplintrc.json  \u2190 \u30a2\u30d7\u30ea\u56fa\u6709\u306e\u8a2d\u5b9a\n\u2502   \u2514\u2500\u2500 blog\/         \u2190 Astro\n\u2502       \u2514\u2500\u2500 .markuplintrc.json  \u2190 \u30a2\u30d7\u30ea\u56fa\u6709\u306e\u8a2d\u5b9a\n\u251c\u2500\u2500 packages\/\n\u2502   \u2514\u2500\u2500 ui\/           \u2190 React\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u30e9\u30a4\u30d6\u30e9\u30ea\n\u2502       \u2514\u2500\u2500 .markuplintrc.json<\/code><\/pre><\/div>\n\n
  \/\/ apps\/web\/.markuplintrc.json\uff08\u30eb\u30fc\u30c8\u3092\u7d99\u627f\u3057\u3066\u4e0a\u66f8\u304d\uff09\n{\n  \"extends\": [\"..\/..\/.markuplintrc.json\", \"markuplint:recommended-react\"],\n  \"parser\": {\n    \"\\\\.tsx$\": \"@markuplint\/jsx-parser\"\n  },\n  \"specs\": {\n    \"\\\\.tsx$\": \"@markuplint\/react-spec\"\n  }\n}<\/code><\/pre><\/div>\n\n\n
  \n\n\n\n
  \u30ab\u30b9\u30bf\u30e0\u30eb\u30fc\u30eb\u306e\u4f5c\u6210<\/h2>\n\n\n\n
  \u30d7\u30ed\u30b8\u30a7\u30af\u30c8\u56fa\u6709\u306eHTML\u898f\u7d04\u3092\u5f37\u5236\u3057\u305f\u3044\u5834\u5408\u3001\u30ab\u30b9\u30bf\u30e0\u30eb\u30fc\u30eb\u3092\u4f5c\u6210\u3067\u304d\u307e\u3059\u3002<\/p>\n\n\n
  ># \u30ab\u30b9\u30bf\u30e0\u30eb\u30fc\u30eb\u4f8b2: \u7279\u5b9a\u306e\u30af\u30e9\u30b9\u540d\u898f\u7d04\u3092\u5f37\u5236\u3059\u308b\uff08BEM\u547d\u540d\u898f\u5247\u30c1\u30a7\u30c3\u30af\uff09\n\n\/\/ markuplint-rules\/bem-class-naming.js\nimport { createRule } from '@markuplint\/ml-core'\n\n\/\/ BEM\u547d\u540d\u898f\u5247: block__element--modifier\nconst bemPattern = \/^[a-z][a-z0-9]*(__[a-z][a-z0-9]*)?(--[a-z][a-z0-9]*)?$\/\n\nexport default createRule({\n  name: 'bem-class-naming',\n  defaultSeverity: 'warning',\n  verify({ attr, report }) {\n    if (attr.name !== 'class') return\n    const classes = attr.value.split(' ')\n    for (const cls of classes) {\n      if (cls && !bemPattern.test(cls)) {\n        report({\n          message: `\u30af\u30e9\u30b9\u540d \"${cls}\" \u306fBEM\u547d\u540d\u898f\u5247\u306b\u9055\u53cd\u3057\u3066\u3044\u307e\u3059`,\n          line: attr.line,\n          col: attr.col,\n        })\n      }\n    }\n  },\n})<\/code><\/pre><\/div>\n\n
  \/\/ .markuplintrc.json \u3067\u30ab\u30b9\u30bf\u30e0\u30eb\u30fc\u30eb\u3092\u8aad\u307f\u8fbc\u3080\n{\n  \"extends\": [\"markuplint:recommended\"],\n  \"customRules\": {\n    \"bem-class-naming\": \".\/markuplint-rules\/bem-class-naming.js\"\n  },\n  \"rules\": {\n    \"bem-class-naming\": true\n  }\n}<\/code><\/pre><\/div>\n\n\n
  \n\n\n\n
  \u65e2\u5b58\u30d7\u30ed\u30b8\u30a7\u30af\u30c8\u3078\u306e\u6bb5\u968e\u7684\u5c0e\u5165\u6226\u7565<\/h2>\n\n\n\n
  \u5927\u898f\u6a21\u306a\u65e2\u5b58\u30d7\u30ed\u30b8\u30a7\u30af\u30c8\u3078\u306e\u5c0e\u5165\u306f\u3001\u4e00\u5ea6\u306b\u5168\u30a8\u30e9\u30fc\u3092\u4fee\u6b63\u3057\u3088\u3046\u3068\u3059\u308b\u3068\u7834\u7dbb\u3057\u307e\u3059\u3002\u4ee5\u4e0b\u306e4\u30b9\u30c6\u30c3\u30d7\u3067\u6bb5\u968e\u7684\u306b\u5c0e\u5165\u3059\u308b\u3053\u3068\u3092\u63a8\u5968\u3057\u307e\u3059\u3002<\/p>\n\n\n\n
  \n  
  Step1: \u307e\u305a\u52d5\u304b\u3059<\/strong>\u2015\u2015\u3059\u3079\u3066\u306e\u30eb\u30fc\u30eb\u3092false<\/code>\u307e\u305f\u306fwarning<\/code>\u306b\u3057\u3066Markuplint\u3092\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\u3057\u3001CI\u3092\u901a\u3059\u3002<\/li>\n  
  Step2: \u91cd\u8981\u30eb\u30fc\u30eb\u3092error\u306b\u6607\u683c<\/strong>\u2015\u2015heading-levels<\/code>\u30fbrequired-attr<\/code>\u306a\u3069\u5f71\u97ff\u306e\u5927\u304d\u3044\u30eb\u30fc\u30eb\u304b\u3089\u9806\u306berror\u306b\u3059\u308b\u3002<\/li>\n  
  Step3: \u65b0\u898f\u30d5\u30a1\u30a4\u30eb\u306e\u307f\u53b3\u683c\u5316<\/strong>\u2015\u2015overrides<\/code>\u3092\u4f7f\u3044\u3001\u65e2\u5b58\u30d5\u30a1\u30a4\u30eb\u306fwarning\u30fb\u65b0\u898f\u30d5\u30a1\u30a4\u30eb\u306ferror\u3068\u3044\u3046\u8a2d\u5b9a\u306b\u3059\u308b\u3002<\/li>\n  
  Step4: \u5168\u30d5\u30a1\u30a4\u30eb\u306b\u5c55\u958b<\/strong>\u2015\u2015\u4fee\u6b63\u304c\u5b8c\u4e86\u3057\u305f\u30d5\u30a1\u30a4\u30eb\u304b\u3089\u9806\u6b21overrides<\/code>\u5bfe\u8c61\u5916\u306b\u3057\u3066error\u30eb\u30fc\u30eb\u3092\u9069\u7528\u3059\u308b\u3002<\/li>\n<\/ol>\n\n\n
  \/\/ \u6bb5\u968e\u7684\u5c0e\u5165\u306e\u305f\u3081\u306e.markuplintrc.json\u4f8b\n{\n  \"extends\": [\"markuplint:recommended\"],\n  \"rules\": {\n    \/\/ \u307e\u305a\u3059\u3079\u3066warning\u306b\n    \"heading-levels\": \"warning\",\n    \"wai-aria\": \"warning\",\n    \"required-attr\": \"warning\"\n  },\n  \"overrides\": {\n    \/\/ \u65b0\u898f\u30d5\u30a1\u30a4\u30eb\uff08src\/new\/\u914d\u4e0b\uff09\u306ferror\u306b\n    \"src\/new\/**\/*.{html,tsx,vue}\": {\n      \"rules\": {\n        \"heading-levels\": \"error\",\n        \"wai-aria\": \"error\",\n        \"required-attr\": \"error\"\n      }\n    }\n  }\n}<\/code><\/pre><\/div>\n\n\n
  \n\n\n\n
  \u3064\u307e\u305a\u304d\u3084\u3059\u3044\u30dd\u30a4\u30f3\u30c8\u3068\u5bfe\u51e6\u6cd5<\/h2>\n\n\n
  >\u3010\u3088\u304f\u3042\u308b\u554f\u984c\u3068\u89e3\u6c7a\u7b56\u3011\n\n\u25a0 \u554f\u984c1: \u30a2\u30a4\u30b3\u30f3\u30dc\u30bf\u30f3\u306e\u30a2\u30af\u30bb\u30b7\u30d6\u30eb\u306a\u540d\u524d\u30a8\u30e9\u30fc\n<button type=\"button\">\n  <svg viewBox=\"0 0 24 24\"><path d=\"M6 18L18 6M6 6l12 12\"\/><\/svg>\n<\/button>\n\u2192 \u30a8\u30e9\u30fc: 'button' element has no accessible name\n\n\u2705 \u4fee\u6b63\u65b9\u6cd51: aria-label \u3092\u8ffd\u52a0\n<button type=\"button\" aria-label=\"\u9589\u3058\u308b\">\n  <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\" focusable=\"false\">\n    <path d=\"M6 18L18 6M6 6l12 12\"\/>\n  <\/svg>\n<\/button>\n\n\u2705 \u4fee\u6b63\u65b9\u6cd52: visually-hidden \u30c6\u30ad\u30b9\u30c8\u3092\u8ffd\u52a0\n<button type=\"button\">\n  <span class=\"sr-only\">\u9589\u3058\u308b<\/span>\n  <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\">...<\/svg>\n<\/button>\n\n\u25a0 \u554f\u984c2: React\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u306eprops\u5c5e\u6027\u30a8\u30e9\u30fc\n<MyComponent customProp=\"value\" \/>\n\u2192 \u30a8\u30e9\u30fc: 'customProp' is not a valid attribute\n\n\u2705 \u89e3\u6c7a: ignoreAttrNamePrefix \u307e\u305f\u306f ignoreAttrName \u3067\u9664\u5916\n\"invalid-attr\": {\n  \"options\": {\n    \"ignoreAttrNamePrefix\": [\"custom\"]\n  }\n}\n\n\u25a0 \u554f\u984c3: \u52d5\u7684\u306aclass\u540d\u3067BEM\u9055\u53cd\u30a8\u30e9\u30fc\n<div className={`block ${isActive ? 'block--active' : ''}`}>\n\u2192 \u52d5\u7684\u5024\u306fMarkuplint\u304c\u89e3\u6790\u3067\u304d\u306a\u3044\n\n\u2705 \u89e3\u6c7a: markuplint-disable-next-line \u3067\u8a72\u5f53\u884c\u3092\u9664\u5916<\/code><\/pre><\/div>\n\n\n
  \n\n\n\n
  \u3088\u304f\u3042\u308b\u8cea\u554f<\/h2>\n\n\n\n
  Q1. Markuplint\u306f\u3069\u306e\u30bf\u30a4\u30df\u30f3\u30b0\u3067\u5b9f\u884c\u3059\u3079\u304d\u3067\u3059\u304b\uff1f<\/h3>\n\n\n\n
  A.<\/strong> VSCode\u62e1\u5f35\u6a5f\u80fd\u3067\u30ea\u30a2\u30eb\u30bf\u30a4\u30e0\u30c1\u30a7\u30c3\u30af\u3001pre-commit\u30d5\u30c3\u30af\u3067\u30b3\u30df\u30c3\u30c8\u524d\u30c1\u30a7\u30c3\u30af\u3001GitHub Actions\u3067PR\u30de\u30fc\u30b8\u524d\u30c1\u30a7\u30c3\u30af\u306e3\u6bb5\u968e\u304c\u7406\u60f3\u3067\u3059\u3002\u91cd\u8981\u5ea6\u306e\u9ad8\u3044\u9806\u306bGitHub Actions\uff08\u5fc5\u9808\uff09\u2192 pre-commit\uff08\u63a8\u5968\uff09\u2192 VSCode\uff08\u4efb\u610f\uff09\u306e\u9806\u3067\u5c0e\u5165\u3057\u3066\u304f\u3060\u3055\u3044\u3002<\/p>\n\n\n\n
  Q2. \u65e2\u5b58\u30d7\u30ed\u30b8\u30a7\u30af\u30c8\u3078\u306e\u5c0e\u5165\u3067\u30a8\u30e9\u30fc\u304c\u5927\u91cf\u306b\u51fa\u3066\u56f0\u3063\u3066\u3044\u307e\u3059\u3002\u3069\u3046\u3059\u308c\u3070\u3044\u3044\u3067\u3059\u304b\uff1f<\/h3>\n\n\n\n
  A.<\/strong> \u6bb5\u968e\u7684\u306a\u5c0e\u5165\u304c\u63a8\u5968\u3067\u3059\u3002\u6700\u521d\u306f\u30eb\u30fc\u30eb\u3092\u4e00\u65e6\u3059\u3079\u3066 false<\/code> \u306b\u3059\u308b\u304b\u8b66\u544a\u30ec\u30d9\u30eb\u306b\u3057\u3066 Markuplint \u304c\u52d5\u304f\u72b6\u614b\u306b\u3057\u3066\u304b\u3089\u3001\u6bb5\u968e\u7684\u306b\u30eb\u30fc\u30eb\u3092\u6709\u52b9\u306b\u3057\u3066\u3044\u304f\u65b9\u6cd5\u304c\u5b9f\u7528\u7684\u3067\u3059\u3002\u7279\u306b\u7269\u91cf\u304c\u591a\u3044\u5834\u5408\u306foverrides<\/code>\u3092\u4f7f\u3063\u3066\u65b0\u898f\u30d5\u30a1\u30a4\u30eb\u306e\u307f\u53b3\u683c\u5316\u3057\u3001\u65e2\u5b58\u30d5\u30a1\u30a4\u30eb\u306f\u5f8c\u304b\u3089\u4fee\u6b63\u3057\u3066\u3044\u304f\u65b9\u6cd5\u304c\u73fe\u5b9f\u7684\u3067\u3059\u3002<\/p>\n\n\n\n
  Q3. \u30ab\u30b9\u30bf\u30e0\u30eb\u30fc\u30eb\u3092\u4f5c\u308a\u305f\u3044\u5834\u5408\u3001\u3069\u3053\u304b\u3089\u59cb\u3081\u308c\u3070\u3044\u3044\u3067\u3059\u304b\uff1f<\/h3>\n\n\n\n
  A.<\/strong> @markuplint\/ml-core<\/code>\u306ecreateRule<\/code>\u95a2\u6570\u3092\u4f7f\u3044\u307e\u3059\u3002\u4e0a\u8ff0\u306e\u30ab\u30b9\u30bf\u30e0\u30eb\u30fc\u30eb\u30bb\u30af\u30b7\u30e7\u30f3\u306e\u5b9f\u88c5\u4f8b\u3092\u53c2\u8003\u306b\u3057\u3066\u304f\u3060\u3055\u3044\u3002<\/p>\n\n\n\n
  Q4. Next.js App Router \u306e\u30b5\u30fc\u30d0\u30fc\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\uff08RSC\uff09\u3067\u306e\u6ce8\u610f\u70b9\u306f\u3042\u308a\u307e\u3059\u304b\uff1f<\/h3>\n\n\n\n
  A.<\/strong> Next.js App Router\u306e\u30b5\u30fc\u30d0\u30fc\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u306fTypeScript\/JSX\u3067\u8a18\u8ff0\u3055\u308c\u308b\u305f\u3081\u3001\u901a\u5e38\u306e@markuplint\/jsx-parser<\/code>\u3067\u89e3\u6790\u53ef\u80fd\u3067\u3059\u3002\u305f\u3060\u3057\u6ce8\u610f\u70b9\u304c3\u3064\u3042\u308a\u307e\u3059\u3002\uff081\uff09async<\/code>\u306a\u30b5\u30fc\u30d0\u30fc\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u306e\u95a2\u6570\u5ba3\u8a00\u306fMarkuplint\u304c\u89e3\u6790\u30a8\u30e9\u30fc\u306b\u306a\u308b\u53ef\u80fd\u6027\u304c\u3042\u308b\u305f\u3081\u3001overrides<\/code>\u3067app\/**\/*.tsx<\/code>\u306e\u4e00\u90e8\u30eb\u30fc\u30eb\u3092\u8abf\u6574\u3059\u308b\u5fc5\u8981\u304c\u3042\u308a\u307e\u3059\u3002\uff082\uff09'use client'<\/code>\u30c7\u30a3\u30ec\u30af\u30c6\u30a3\u30d6\u306fJSX\u306e\u30b3\u30e1\u30f3\u30c8\u3067\u306f\u306a\u3044\u305f\u3081\u89e3\u6790\u4e0a\u554f\u984c\u3042\u308a\u307e\u305b\u3093\u3002\uff083\uff09Metadata API\u3067\u751f\u6210\u3055\u308c\u308bHTML\u30bf\u30b0\uff08title<\/code>\u3001meta<\/code>\u7b49\uff09\u306f\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u306eJSX\u306b\u542b\u307e\u308c\u306a\u3044\u305f\u3081\u3001Markuplint\u306e\u30c1\u30a7\u30c3\u30af\u5bfe\u8c61\u5916\u306b\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n
  Q5. \u30c1\u30fc\u30e0\u3067\u4e00\u90e8\u306e\u30e1\u30f3\u30d0\u30fc\u304c\u30eb\u30fc\u30eb\u3092\u7121\u8996\u3057\u3066\u30b3\u30df\u30c3\u30c8\u3057\u3066\u3057\u307e\u3044\u307e\u3059\u3002\u5f37\u5236\u3059\u308b\u65b9\u6cd5\u306f\u3042\u308a\u307e\u3059\u304b\uff1f<\/h3>\n\n\n\n
  A.<\/strong> \u3044\u304f\u3064\u304b\u306e\u65b9\u6cd5\u3067\u5f37\u5236\u3067\u304d\u307e\u3059\u3002\uff081\uff09pre-commit\u30d5\u30c3\u30af<\/strong>\uff08husky + lint-staged\uff09: \u30ed\u30fc\u30ab\u30eb\u3067\u30b3\u30df\u30c3\u30c8\u6642\u306b\u81ea\u52d5\u30c1\u30a7\u30c3\u30af\u3002\u305f\u3060\u3057 git commit --no-verify<\/code> \u3067\u56de\u907f\u3067\u304d\u307e\u3059\u3002\uff082\uff09GitHub Actions<\/strong>: PR\u306eCI\u3067Markuplint\u3092\u5b9f\u884c\u3057\u3001\u30a8\u30e9\u30fc\u304c\u3042\u308c\u3070\u30de\u30fc\u30b8\u3092\u30d6\u30ed\u30c3\u30af\uff08Branch\u30d7\u30ed\u30c6\u30af\u30b7\u30e7\u30f3\u30eb\u30fc\u30eb\u3067\u300cRequired status checks\u300d\u306b\u8a2d\u5b9a\uff09\u3002\u3053\u308c\u306f\u56de\u907f\u4e0d\u53ef\u80fd\u3067\u6700\u3082\u78ba\u5b9f\u306a\u65b9\u6cd5\u3067\u3059\u3002\uff083\uff09CODEOWNERS + Required Reviews<\/strong>: HTML\u30d5\u30a1\u30a4\u30eb\u306e\u5909\u66f4\u306b\u7279\u5b9a\u30ec\u30d3\u30e5\u30ef\u30fc\u306eapproval\u3092\u5fc5\u9808\u306b\u3059\u308b\u3002\u6bb5\u968e\u7684\u306b\u5c0e\u5165\u3057\u3001\u6700\u7d42\u7684\u306b\u306fGitHub Actions\u3067\u306eCI\u30c1\u30a7\u30c3\u30af\u3092\u5fc5\u9808\u5316\u3059\u308b\u306e\u304c\u30d9\u30b9\u30c8\u30d7\u30e9\u30af\u30c6\u30a3\u30b9\u3067\u3059\u3002<\/p>\n\n\n\n
  \n\n\n\n
  \u307e\u3068\u3081<\/h2>\n\n\n\n
  \n  
  Markuplint<\/strong>\uff1aHTML\u5c02\u7528\u30ea\u30f3\u30bf\u30fc\u3002\u30bf\u30b0\u306e\u6b63\u3057\u3044\u4f7f\u3044\u65b9\u30fbARIA\u30fb\u898b\u51fa\u3057\u30a2\u30a6\u30c8\u30e9\u30a4\u30f3\u30fb\u5fc5\u9808\u5c5e\u6027\u3092\u81ea\u52d5\u30c1\u30a7\u30c3\u30af\u3002ESLint\u3068\u306e\u4e8c\u6bb5\u69cb\u3048\u304c\u63a8\u5968\u3002<\/li>\n  
  \u5c0e\u5165\u30b9\u30c6\u30c3\u30d7<\/strong>\uff1anpx markuplint –init \u3067\u5bfe\u8a71\u5f0f\u521d\u671f\u8a2d\u5b9a \u2192 VSCode\u62e1\u5f35\u6a5f\u80fd \u2192 pre-commit\u9023\u643a \u2192 GitHub Actions \u306e\u9806\u3067\u6bb5\u968e\u7684\u306b\u5c0e\u5165\u3002<\/li>\n  
  \u30d5\u30ec\u30fc\u30e0\u30ef\u30fc\u30af\u5bfe\u5fdc<\/strong>\uff1aReact\/Vue\/Astro\/Svelte\/PHP\u306b\u5bfe\u5fdc\u3002\u5c02\u7528\u306eparser\u3068spec\u3092\u8ffd\u52a0\u3059\u308b\u3060\u3051\u3067\u5bfe\u5fdc\u53ef\u80fd\u3002<\/li>\n  
  \u30a8\u30e9\u30fc\u30ec\u30d9\u30eb\u7ba1\u7406<\/strong>\uff1aerror\/warning\/false\u306e3\u6bb5\u968e\u3002\u65e2\u5b58PJ\u3078\u306e\u5c0e\u5165\u6642\u306fwarning\u304b\u3089\u59cb\u3081\u3066\u6bb5\u968e\u7684\u306berror\u306b\u6607\u683c\u3055\u305b\u308b\u3002<\/li>\n  
  ignore\u30b3\u30e1\u30f3\u30c8<\/strong>\uff1a\u7279\u5b9a\u884c\u3084\u7279\u5b9a\u30eb\u30fc\u30eb\u3092\u7121\u52b9\u5316\u3067\u304d\u308b\u3002\u30b5\u30fc\u30c9\u30d1\u30fc\u30c6\u30a3\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u3084\u907f\u3051\u3089\u308c\u306a\u3044\u69cb\u9020\u306b\u4f7f\u7528\u3002<\/li>\n  
  Monorepo\u5bfe\u5fdc<\/strong>\uff1a\u30eb\u30fc\u30c8\u306b\u5171\u901a\u8a2d\u5b9a\u3092\u7f6e\u304d\u3001\u5404\u30a2\u30d7\u30ea\u304cextends\u3067\u7d99\u627f\u3059\u308b\u30d1\u30bf\u30fc\u30f3\u304c\u7ba1\u7406\u3057\u3084\u3059\u3044\u3002<\/li>\n  
  \u30ab\u30b9\u30bf\u30e0\u30eb\u30fc\u30eb<\/strong>\uff1acreateRule\u3067\u30d7\u30ed\u30b8\u30a7\u30af\u30c8\u56fa\u6709\u306eHTML\u898f\u7d04\u3092\u5f37\u5236\u3067\u304d\u308b\u3002BEM\u547d\u540d\u898f\u5247\u30c1\u30a7\u30c3\u30af\u306a\u3069\u3092\u81ea\u4f5c\u53ef\u80fd\u3002<\/li>\n  
  GitHub Actions<\/strong>\uff1aPR\u306eHTML\u5909\u66f4\u306b\u5bfe\u3057\u3066\u81ea\u52d5\u3067Markuplint\u3092\u5b9f\u884c\u3002\u30a8\u30e9\u30fc\u304c\u884c\u5358\u4f4d\u306e\u30a2\u30ce\u30c6\u30fc\u30b7\u30e7\u30f3\u3068\u3057\u3066\u8868\u793a\u3055\u308c\u308b\u3002<\/li>\n<\/ul>\n\n\n\n
  Markuplint\u306fHTML\u306e\u54c1\u8cea\u3092\u30c1\u30fc\u30e0\u3067\u5747\u4e00\u306b\u4fdd\u3064\u305f\u3081\u306e\u5fc5\u9808\u30c4\u30fc\u30eb\u3067\u3059\u3002\u307e\u305aVSCode\u62e1\u5f35\u6a5f\u80fd\u3092\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\u3057\u3066\u3001\u81ea\u5206\u306e\u30b3\u30fc\u30c9\u304c\u3069\u3093\u306a\u30a8\u30e9\u30fc\u3092\u6301\u3063\u3066\u3044\u308b\u304b\u78ba\u8a8d\u3057\u3066\u307f\u307e\u3057\u3087\u3046\u3002\u305d\u306e\u5f8c\u3001\u6bb5\u968e\u7684\u306bpre-commit\u9023\u643a\u3068GitHub Actions\u306b\u5c0e\u5165\u3059\u308b\u3053\u3068\u3067\u3001\u4e0d\u6b63\u306aHTML\u304c\u30ea\u30dd\u30b8\u30c8\u30ea\u306b\u5165\u308a\u8fbc\u3080\u3053\u3068\u3092\u6839\u672c\u304b\u3089\u9632\u3050\u54c1\u8cea\u7ba1\u7406\u306e\u4ed5\u7d44\u307f\u304c\u5b8c\u6210\u3057\u307e\u3059\u3002<\/span><\/strong><\/p>\n\n\n\n
  \n\n\n\n\n
  \u95a2\u9023\u8a18\u4e8b<\/h2>\n\n\n\n
  \n
  WAI-ARIA\u5b8c\u5168\u30ac\u30a4\u30c9\uff5caria-label\u30fbaria-live\u30fb\u30d5\u30a9\u30fc\u30ab\u30b9\u7ba1\u7406\u30fb\u30ad\u30fc\u30dc\u30fc\u30c9\u30ca\u30d3\u30b2\u30fc\u30b7\u30e7\u30f3\u30fbReact\u30a2\u30af\u30bb\u30b7\u30d3\u30ea\u30c6\u30a3\u30fbaxe\u30c6\u30b9\u30c8\u307e\u3067\u5fb9\u5e95\u89e3\u8aac<\/a><\/li>\n
  WebP\/AVIF\u5b8c\u5168\u30ac\u30a4\u30c9\uff5cpicture\u8981\u7d20\u3067\u5b9f\u88c5\u3059\u308b\u30d5\u30a9\u30fc\u30eb\u30d0\u30c3\u30af<\/a><\/li>\n
  CSP\u5b8c\u5168\u30ac\u30a4\u30c9\uff5cXSS\u5bfe\u7b56\u304b\u3089\u6bb5\u968e\u7684\u5c0e\u5165\u307e\u3067\u30102026\u5e74\u7248\u3011<\/a><\/li>\n
  Jamstack\u30d5\u30a9\u30fc\u30e0\u51e6\u7406\u30102026\u5e74\u7248\u3011\u30b5\u30fc\u30d0\u30fc\u30ec\u30b9\u5b9f\u88c5\u5b8c\u5168\u30ac\u30a4\u30c9<\/a><\/li>\n
  details\u30fbsummary\u30bf\u30b0\u5b8c\u5168\u30ac\u30a4\u30c9\u30102026\u5e74\u7248\u3011\u30a2\u30af\u30bb\u30b7\u30d6\u30eb\u306a\u30a2\u30b3\u30fc\u30c7\u30a3\u30aa\u30f3UI\u5b9f\u88c5<\/a><\/li>\n<\/ul>\n\n\n\n
  \n\n\n\n\n
  \u53c2\u8003\u30ea\u30f3\u30af\uff08\u516c\u5f0f\u30fb\u4e00\u6b21\u60c5\u5831\uff09<\/h2>\n\n\n\n
  \n
  MDN Web Docs \u2014 HTML<\/a><\/li>\n
  MDN Web Docs \u2014 CSS<\/a><\/li>\n
  MDN Web Docs \u2014 JavaScript<\/a><\/li>\n
  React \u516c\u5f0f\u30c9\u30ad\u30e5\u30e1\u30f3\u30c8<\/a><\/li>\n<\/ul>\n\n\n\n
  \n\n\n\n
  WithCode\u3092\u4f53\u9a13\u3067\u304d\u308b\u521d\u7d1a\u30b3\u30fc\u30b9\u516c\u958b\u4e2d\uff01<\/h2>\n\n\n
  \n
  <\/figure>\n<\/div>\n\n\n
  \u521d\u7d1a\u30b3\u30fc\u30b9(\u00a549,800)\u304c\u5b8c\u5168\u7121\u6599\u306b\uff01<\/h3>\n\n\n\n
  \n
  \u671f\u9593\uff1a1\u9031\u9593<\/strong><\/li>\n
  \u5b66\u7fd2\u5185\u5bb9\uff1a<\/strong>
  \u30ed\u30fc\u30c9\u30de\u30c3\u30d7\/\u57fa\u790e\u77e5\u8b58\/\u74b0\u5883\u69cb\u7bc9\/HTML\/CSS\/LP\u30fb\u30dd\u30fc\u30c8\u30d5\u30a9\u30ea\u30aa\u4f5c\u6210<\/strong>
  \u2192 \u6b63\u3057\u3044\u5b66\u7fd2\u65b9\u6cd5\u3067\u300c\u78ba\u304b\u306a\u6210\u9577\u300d\u3092\u5b9f\u611f\u3067\u304d\u308b\u30ab\u30ea\u30ad\u30e5\u30e9\u30e0\u3002<\/span><\/strong><\/li>\n<\/ul>\n\n\n\n
  \u526f\u696d\u30fb\u30d5\u30ea\u30fc\u30e9\u30f3\u30b9\u304c\u4e3b\u6d41\u306b\u306a\u3063\u3066\u3044\u308b\u4eca\u3053\u305d\u3001\u81ea\u3089\u306e\u30b9\u30ad\u30eb\u3067\u7a3c\u3052\u308b\u4eba\u6750\u3092\u76ee\u6307\u3057\u3066\u307f\u307e\u305b\u3093\u304b\uff1f<\/p>\n\n\n\n
  \u672a\u7d4c\u9a13\u3067\u3082\u5fc3\u914d\u3059\u308b\u3053\u3068\u306f\u3042\u308a\u307e\u305b\u3093\u3002\u521d\u7d1a\u30b3\u30fc\u30b9\u3092\u53d7\u8b1b\u3055\u308c\u308b\u65b9\u306e\u5927\u591a\u6570\u306f\u30d7\u30ed\u30b0\u30e9\u30df\u30f3\u30b0\u672a\u7d4c\u9a13\u3067\u3059\u3002\u307e\u305a\u306f\u7121\u6599\u30ab\u30a6\u30f3\u30bb\u30ea\u30f3\u30b0\u3067\u3001\u60a9\u307f\u3084\u4e0d\u5b89\u3092\u304a\u805e\u304b\u305b\u304f\u3060\u3055\u3044\uff01<\/p>\n\n\n\n
  \n
  \u516c\u5f0f\u30b5\u30a4\u30c8\u304b\u3089\u7121\u6599\u30ab\u30a6\u30f3\u30bb\u30ea\u30f3\u30b0\u306b\u7533\u3057\u8fbc\u3080 \u2192<\/strong><\/a><\/div>\n<\/div>\n\n\n\n\n