docs: add faq page (#302)

* docs: add faq page

* Update .cspell.json

Author: yeonjuan

.cspell.json

@@ -13,6 +13,7 @@
     "packages/eslint-plugin/types/**"
   ],
   "words": [
+    "tseslint",
     "frontmatter",
     "rehype",
     "tailwindcss",

docs/faq.md

@@ -0,0 +1,21 @@
+# FAQs
+
+## Problem when using typescript-eslint typed linting.
+
+```
+Error: Error while loading rule '@typescript-eslint/await-thenable': You have used a rule which requires type information, but don't have parserOptions set to generate type information for this file....
+Parser: @html-eslint/parser
+```
+
+When using [typescript-eslint Typed-Linting](https://typescript-eslint.io/troubleshooting/typed-linting), the above error may occur for HTML files. In this case, disable typed-linting rules for HTML.
+
+```js
+export default tseslint.config(
+  //...,
+  {
+    files: ["**/*.html"],
+    extends: [tseslint.configs.disableTypeChecked],
+  }
+  // ...
+);
+```

packages/website/src/assets/icon-question.svg

@@ -14,9 +14,16 @@
           <a
             href="~/src/privacy-policy.html"
             target="_blank noreferrer"
-            class="text-slate-600 pl-2"
+            class="text-slate-600 border-r border-black-500 pl-2 pr-2"
           >Privacy Policy</a>
         </li>
+        <li>
+          <a
+            href="~/src/docs/faq.html"
+            target="_blank noreferrer"
+            class="text-slate-600 pl-2"
+          >FAQs</a>
+        </li>
       </ul>
       <span class="text-black-500">Copyright © 2025 html-eslint</span>
     </div>

packages/website/src/components/footer.html

@@ -91,6 +91,26 @@
           >
         </a>
       </li>
+      <li>
+        <a href="~/src/docs/faq.html" class="w-full flex items-center">
+          <div class="w-[28px] h-[28px] rounded-[6px] p-[6px] border-[1px] border-gray-300 drop-shadow-[4px_0_2px_#E8EBEF] mr-[12px]">
+            <img
+              src="~/src/assets/icon-question.svg"
+              alt=""
+              width="14"
+              height="14"
+            >
+          </div>
+          <span class="title5">FAQs</span>
+          <img
+            src="~/src/assets/icon-chevron-right.svg"
+            alt=""
+            class="ml-auto"
+            width="20"
+            height="20"
+          >
+        </a>
+      </li>
       <li>
         <a href="~/src/docs/rules.html" class="w-full flex items-center">
           <div class="w-[28px] h-[28px] rounded-[6px] p-[6px] border-[1px] border-gray-300 drop-shadow-[4px_0_2px_#E8EBEF] mr-[12px]">