Skip to content

Add ESLint configuration for consistent code quality #50

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 4 commits into
base: main
Choose a base branch
from

Conversation

Jerek0
Copy link
Member

@Jerek0 Jerek0 commented Jun 30, 2025

🧼 Add ESLint configuration for consistent code quality

This PR introduces a modern ESLint setup providing a consistent baseline for JavaScript, TypeScript, and Astro files. The configuration is lightweight and integrates smoothly with our existing tooling (Prettier, TypeScript, and lint-staged).


🧠 Why?

This ESLint setup would work alongside Prettier to help us maintain a high-quality and reliable codebase.

While Prettier takes care of code formatting (spacing, line length, punctuation, etc.), ESLint focuses on code correctness, consistency, rigor, and safety. It adds another layer of confidence by:

  • Preventing common bugs (e.g., unused variables, unreachable code, forgotten await)
  • Enforcing safer patterns in TypeScript (e.g., discouraging use of any)
  • Promoting consistent logic structures across contributors and teams
  • Helping new developers onboard more easily by guiding them toward the expected practices

Together, Prettier and ESLint ensure our code is not only clean to look at—but also clean to run and maintain.

Note

This setup is inspired from one of our projects (Scout) and our pleasant experience with it.

🔧 What's included

  • ✅ ESLint with official @eslint/js recommendations
  • ✅ TypeScript support via @typescript-eslint
  • ✅ Compatibility with Prettier using eslint-config-prettier
  • ✅ Astro support via eslint-plugin-astro
  • ✅ Linting is automatically run on staged files via lint-staged and simple-git-hooks

⚙️ How it works

  • ESLint is configured in eslint.config.js using the new flat config format
  • On pre-commit, the following happens automatically thanks to simple-git-hooks and lint-staged:
    • Prettier runs on all staged files (*) — as usual
    • ESLint runs on any staged .js, .ts, .jsx, .tsx, or .astro files and auto-fixes where possible
  • This ensures that common issues are caught and fixed before they reach a commit

📁 Default ignores

The config ignores the following paths by default:

  • .astro/ (Astro build artifacts)
  • dist/ (build output)
  • node_modules/

💬 Feedback welcome

💡 This setup is designed to be helpful without being intrusive. If you run into issues or have suggestions (e.g., rules to add or remove, formatting conflicts), feel free to open a discussion or contribute directly.

Let’s keep our code clean, consistent, and a little easier to love.


Warning

This PR doesn't fix errors found by ESLint on the whole project. Since this PR only allows to run the linter on staged files, I chose to ignore those for the moment. Once merged, one should — probably me — create another PR to fix all the issues on the repo.

@Jerek0 Jerek0 requested a review from a team June 30, 2025 23:37
@Jerek0 Jerek0 added the enhancement New feature or request label Jun 30, 2025
Copy link

vercel bot commented Jun 30, 2025

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Updated (UTC)
astro-boilerplate ✅ Ready (Inspect) Visit Preview Jul 3, 2025 5:53pm

@devenini
Copy link
Member

devenini commented Jul 3, 2025

Possible to convert eslint.config.js to TypeScript (.ts) so it’s consistent with the other JavaScript files in the repo?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants