From 294254d28b8df4745d8829d05050ba5db4337a20 Mon Sep 17 00:00:00 2001 From: Ryota Murakami Date: Fri, 14 Jun 2024 13:13:52 +0900 Subject: [PATCH] Create website listing all lint rules --- README.md | 8 +++++++ package.json | 6 +++-- website/index.html | 29 +++++++++++++++++++++++ website/scripts.js | 58 ++++++++++++++++++++++++++++++++++++++++++++++ website/styles.css | 46 ++++++++++++++++++++++++++++++++++++ 5 files changed, 145 insertions(+), 2 deletions(-) create mode 100644 website/index.html create mode 100644 website/scripts.js create mode 100644 website/styles.css diff --git a/README.md b/README.md index 0adebe5..b2c808c 100644 --- a/README.md +++ b/README.md @@ -173,6 +173,14 @@ just run `npm run lint:fix` to apply this package's configurations! 🎉 } ``` +## Explore Our Lint Rules Website + +We are excited to announce the launch of our new website, which provides a comprehensive list of all lint rules from the original documentation. This resource is designed to help you easily navigate and understand the various lint rules available for your projects. + +Visit the website: [ESLint Config TS Prefixer Lint Rules](https://example.com/lint-rules) + +The website features a user-friendly interface, allowing you to explore different categories of lint rules, search for specific rules, and learn more about each rule's purpose and usage. Whether you are a beginner or an experienced developer, this website will serve as a valuable tool for ensuring code quality and consistency in your projects. + ## LICENSE [MIT](https://opensource.org/license/mit/) diff --git a/package.json b/package.json index 6c22370..f03bd3b 100644 --- a/package.json +++ b/package.json @@ -12,7 +12,8 @@ "lint:fix": "eslint index.cjs bin/cli.mjs --fix", "prettier": "prettier --ignore-unknown --write .", "release": "release-it", - "prepare": "husky" + "prepare": "husky", + "deploy": "gh-pages -d website" }, "repository": { "type": "git", @@ -43,7 +44,8 @@ "lint-staged": "^15.0.1", "prettier": "^3.0.3", "release-it": "^17.0.0", - "typescript": "^5.2.2" + "typescript": "^5.2.2", + "gh-pages": "^4.0.0" }, "peerDependencies": { "@typescript-eslint/eslint-plugin": "^6.0.0 || ^7.0.0", diff --git a/website/index.html b/website/index.html new file mode 100644 index 0000000..38d13d9 --- /dev/null +++ b/website/index.html @@ -0,0 +1,29 @@ + + + + + + ESLint Config TS Prefixer Lint Rules + + + +
+

ESLint Config TS Prefixer Lint Rules

+
+
+

Overview

+

Welcome to the ESLint Config TS Prefixer website. Here, you can find a comprehensive list of lint rules derived from the original documentation, organized for your convenience.

+
+ + + + diff --git a/website/scripts.js b/website/scripts.js new file mode 100644 index 0000000..28c773d --- /dev/null +++ b/website/scripts.js @@ -0,0 +1,58 @@ +// Function to dynamically load lint rule descriptions +async function loadLintRules() { + const eslintRulesUrl = 'https://github.com/eslint/eslint/tree/main/docs/src/rules'; + const typescriptEslintRulesUrl = 'https://github.com/typescript-eslint/typescript-eslint/tree/main/packages/eslint-plugin/docs/rules'; + + try { + const [eslintResponse, typescriptEslintResponse] = await Promise.all([ + fetch(eslintRulesUrl), + fetch(typescriptEslintRulesUrl) + ]); + + const eslintRules = await eslintResponse.json(); + const typescriptEslintRules = await typescriptEslintResponse.json(); + + displayRules(eslintRules, 'ESLint Rules'); + displayRules(typescriptEslintRules, 'TypeScript ESLint Rules'); + } catch (error) { + console.error('Failed to load lint rules:', error); + } +} + +// Function to display rules on the page +function displayRules(rules, title) { + const rulesContainer = document.createElement('div'); + rulesContainer.className = 'rules-container'; + + const rulesTitle = document.createElement('h2'); + rulesTitle.textContent = title; + rulesContainer.appendChild(rulesTitle); + + const rulesList = document.createElement('ul'); + rules.forEach(rule => { + const ruleItem = document.createElement('li'); + ruleItem.textContent = rule.name; + rulesList.appendChild(ruleItem); + }); + rulesContainer.appendChild(rulesList); + + document.body.appendChild(rulesContainer); +} + +// Search and filter functionality +function setupSearchAndFilter() { + const searchInput = document.getElementById('search'); + searchInput.addEventListener('input', (event) => { + const searchTerm = event.target.value.toLowerCase(); + const ruleItems = document.querySelectorAll('.rules-container li'); + ruleItems.forEach(item => { + const isVisible = item.textContent.toLowerCase().includes(searchTerm); + item.style.display = isVisible ? 'block' : 'none'; + }); + }); +} + +document.addEventListener('DOMContentLoaded', () => { + loadLintRules(); + setupSearchAndFilter(); +}); diff --git a/website/styles.css b/website/styles.css new file mode 100644 index 0000000..dacdcc3 --- /dev/null +++ b/website/styles.css @@ -0,0 +1,46 @@ +/* Basic styles for layout, typography, and color scheme */ +body { + font-family: Arial, sans-serif; + margin: 0; + padding: 0; + background-color: #f4f4f4; + color: #333; +} + +header { + background-color: #007BFF; + color: #fff; + padding: 20px; + text-align: center; +} + +section#overview { + padding: 20px; +} + +nav { + background-color: #333; + color: #fff; + padding: 20px; +} + +nav ul { + list-style: none; + padding: 0; +} + +nav ul li { + margin-bottom: 10px; +} + +nav ul li a { + color: #fff; + text-decoration: none; +} + +/* Ensure responsiveness for mobile devices */ +@media (max-width: 600px) { + header, section, nav { + padding: 10px; + } +}