Home

Awesome

<img src="./app/public/favicon.svg" width="100" height="100"><br>

ESLint Config Inspector

npm version npm downloads

A visual tool for inspecting and understanding your ESLint flat configs.

<img width="1252" alt="Screenshot 1" src="https://github.com/eslint/config-inspector/assets/11247099/d6551d44-445e-4f22-9d8e-ccb8042a6226"> <img width="1362" alt="Screenshot 2" src="https://github.com/eslint/config-inspector/assets/11247099/d74a057a-f674-4a8d-977f-d9b6a3cde949">

Usage

Go to the project root that contains eslint.config.js and run:

npx @eslint/config-inspector@latest

Visit http://localhost:7777/ to view and play with your ESLint config. Changes to the config file will be updated automatically.

Run npx @eslint/config-inspector --help to see all the CLI options available.

Online Preview

Or play it right in your browser now:

Static Build

It is also possible to build a static web app for your ESLint config:

npx @eslint/config-inspector build

This will generate a Single-Page Application (SPA) under .eslint-config-inspector, with the snapshot of the current ESLint config. You can deploy it somewhere, or use it for comparison etc.

Run npx @eslint/config-inspector build --help to see all the CLI options available.

Contributing

We operate under the ESLint Contributor Guidelines, so please be sure to read them before contributing. If you're not sure where to dig in, check out the issues.

Development

This project uses the following stack:

To start the development server:

To test the production build:

License

Apache-2.0 License

<!-- Badges -->