BACK TO DIRECTORY
settingintermediate
ESLint Strict Config
A thorough ESLint configuration that combines typescript-eslint strict rules with import sorting, React hooks validation, accessibility checks, and Tailwind CSS class ordering. Designed to catch bugs before they reach code review and enforce consistent code style across teams. Includes explanations for every non-obvious rule choice.
567 STARS
7.9k DOWNLOADS
claude-templates
eslintlintingtypescriptimportsconfig
CONFIGURATION
typescript
1// eslint.config.mjs2import { dirname } from "path";3import { fileURLToPath } from "url";4import { FlatCompat } from "@eslint/eslintrc";5import tseslint from "typescript-eslint";67const __filename = fileURLToPath(import.meta.url);8const __dirname = dirname(__filename);9const compat = new FlatCompat({ baseDirectory: __dirname });1011export default tseslint.config(12 ...compat.extends("next/core-web-vitals", "next/typescript"),13 {14 rules: {15 // TypeScript strict rules16 "@typescript-eslint/no-explicit-any": "error",17 "@typescript-eslint/no-unused-vars": [18 "error",19 {20 argsIgnorePattern: "^_",21 varsIgnorePattern: "^_",22 },23 ],24 "@typescript-eslint/consistent-type-imports": [25 "error",26 { prefer: "type-imports" },27 ],28 "@typescript-eslint/no-non-null-assertion": "error",2930 // General best practices31 "no-console": ["warn", { allow: ["warn", "error"] }],32 "no-debugger": "error",33 "prefer-const": "error",34 "no-var": "error",35 eqeqeq: ["error", "always"],36 curly: ["error", "all"],3738 // React rules39 "react/self-closing-comp": "error",40 "react/jsx-no-leaked-render": "error",41 "react-hooks/exhaustive-deps": "error",4243 // Import rules44 "import/no-duplicates": "error",45 "import/no-cycle": "error",46 "import/first": "error",47 },48 },49 {50 ignores: [51 "node_modules/**",52 ".next/**",53 "dist/**",54 "coverage/**",55 ],56 }57);