ESLint Config Generator

ESLint is a static analysis tool that finds code quality issues — unused variables, missing dependencies, potential bugs, and security risks. Prettier is a formatter that enforces consistent whitespace and style. They're complementary: ESLint catches logic and quality problems, Prettier handles aesthetics. Use both together: ESLint + eslint-config-prettier to disable formatting conflicts.

Flat config (eslint.config.js) is the new default in ESLint v9+. It uses standard ESM imports instead of string-based plugin names, making dependencies explicit and eliminating magic. The legacy .eslintrc format uses JSON/YAML with string plugin names resolved via node_modules lookup. Flat config is more explicit, easier to debug, and is the recommended approach for new projects.

It flags variables, function parameters, and imports that are declared but never read. Unused code is noise — it confuses readers and bloats bundles. The argsIgnorePattern: '^_' exception is a common convention: prefix intentionally-ignored function parameters with _ (e.g., (_, index) => ...) to suppress the warning.

It's recommended for larger codebases. eslint-plugin-import enforces correct import paths, detects circular dependencies, and optionally sorts imports by group (built-ins, external packages, local files). The import/order rule paired with Prettier makes import blocks clean and consistent across the team.

Install @typescript-eslint/eslint-plugin and @typescript-eslint/parser. Set the parser to @typescript-eslint/parser and extend from @typescript-eslint/recommended. This enables TypeScript-specific rules like no-explicit-any, proper handling of async/await return types, and accurate unused variable detection that understands TypeScript types.

eslint-plugin-jsx-a11y enforces accessibility best practices in JSX — alt text on images, aria attributes, keyboard event handlers, and ARIA role requirements. Enabling it catches accessibility issues at development time rather than during an audit. Highly recommended for any public-facing React or Next.js application.