π§ Prior art
Why yet another Eslint config?β
As you might have noticed, there are already a lot of ESLint configurations in the wild (have a look here or here).
None of these projects share the same goals of Sheriff.
Sheriff has a particular vision.
The main reasons that led to it's creation are:
- easy to setup and use (thank to
create-sheriff-config
) - easy to customize (thanks to the
FlatConfig
format) - sensible defaults, based on years of real world experience in production scenarios
After exploring every possible alternative, i came to the conclusion that none of the other options where close to what i needed for my projects and everyday use. Thatβs why i still opted for making Sheriff.
Related projectsβ
Simple ESLint configsβ
- eslint-config-airbnb (comparison)
- @antfu/eslint-config (comparison)
- eslint-config-canonical
- eslint-config-hardcore
- eslint-config-galex
- eslint-config-everywhere
- eslint-prettier-typescript-config
ESLint wrappersβ
These tools are not just sharable ESLint configs, but are wrappers for ESLint (and in some cases Prettier too) and also provide their CLI and their Editor integrations.
In-depth comparisonsβ
The main technical difference between Sheriff and the other projects is that Sheriff is updated to the most recent version of ESLint and supports the new FlatConfig
instead of relying on weird hacks using the @rushstack/eslint-patch. Because of the technical limitation imposed by this hack, these configs are harder to work with, at multiple levels.
Another key difference is that the design of most of these configs seems to revolve around the idea of stuffing as much rules as possible into the config, regardless of the quality of the experience and the goal of the project.
Sheriff instead was shaped around solid principles and only includes the rules that let it achieve its goals.
In addition, Sheriff features a lot of unique goodies and little nicities that other libraries lack. For a quick glance at the differences between Sheriff and some of the other ESLint configurations mentioned above, have a look at the table below.
Features comparison tableβ
Feature | sheriff | eslint-config-airbnb | standard | eslint-config-standard | @antfu/eslint-config | XO | eslint-config-canonical | eslint-kit | eslint-config-galex | eslint-config-hardcore |
---|---|---|---|---|---|---|---|---|---|---|
FlatConfig | β | β | β | β | β | β | β | β | β | β |
Maintained | β | β | β | β | β | β | β | β | β | β |
Customizable | β | β | β | β | β | β | β | β | β | β |
Rich Docs | β | β | β | β | β | β | β | β | β | β |
Functional programming | β | β | β | β | β | β | β | β | β | β |
Advanced ignores management | β | β | β | β | β | β | β | β | β | β |
Learning curve | π | π | π | π | π | π | π | π | π | π |
Incremental adoption | β | β | β | β | β | β | β | β | β | β |
Typesafe config | β | β | β | β | β | β | β | β | β | β |
Typescript | β | β | β | β | β | β | β | β | β | β |
React | β | β | β | β | β | β | β | β | β | β |
Vue | β | β | β | β | β | β | β | β | β | β |
Solidjs | β | β | β | β | β | β | β | β | β | β |
Svelte | β | β | β | β | β | β | β | β | β | β |
GraphQL | β | β | β | β | β | β | β | β | β | β |
Unicorn | β | β | β | β | β | β | β | β | β | β |
Sonarjs | β | β | β | β | β | β | β | β | β | β |
JSDoc | β | β | β | β | β | β | β | β | β | β |
TSDoc | β | β | β | β | β | β | β | β | β | β |
Import | β | β | β | β | β | β | β | β | β | β |
Lodash | β | β | β | β | β | β | β | β | β | β |
Nextjs | β | β | β | β | β | β | β | β | β | β |
Jest | β | β | β | β | β | β | β | β | β | β |
Vitest | β | β | β | β | β | β | β | β | β | β |
Testing-library | β | β | β | β | β | β | β | β | β | β |
Playwright | β | β | β | β | β | β | β | β | β | β |
Storybook | β | β | β | β | β | β | β | β | β | β |
Astro | β | β | β | β | β | β | β | β | β | β |
Sheriff VS eslint-config-airbnb
β
I cannot not mention the fact that eslint-config-airbnb
is apparently the most popular ESLint config.
However there are a few specific reasons that led to this, and none of them has to do with the quality of the config itself:
- it was one of the first ESLint configs to be created
- the starred repository actually contains a stylistic guide, not just the ESLint config. The endorsements are for the guide, not the ESLint config
- the repository is owned by Airbnb. Many developers through the years starred it just for their enthusiasm for the company, not for the ESLint library in particular
- for many years, it was the deafult ESLint config in many popular boilerplates and React guides/articles
As of today it's frowned upon by many industry professionals. Some of the most glaring issues:
- it's largely outdated and not maintained since quite some time
- It's big, bloated, too strict for most projects
- it doesn't support TypeScript out of the box, to get it you actually have to use a different library, even less maintained and supported than the original one
Sheriff VS @antfu/eslint-config
β
Antfu config shares many similarities with Sheriff, but is less mature and has less features.
Also, it's important to note that it goes for a very opinionated route toward styling, where instead of adopting Prettier, it relies on eslint-stylistic for it's formatting needs.
That being said, Antfu is a prominent figure in the Javascript community and Sheriff takes some inpiration from his config.
Ultimately, both Sheriff and Antfu are good choices, but they have different flavors.
Sheriff VS XOβ
XO is an interesting project. It uses ESLint and Prettier under the hood, but don't directly expose them to you. Instead of relying on the ESLint CLI and VSCode Extensions, it has it's own CLI and VSCode Extension. On the surface, it can seem like a good thing because it allows them to provide a more integrated experience, but it also means that you are locked into their ecosystem and you cannot freely extend them.
It is very opinionated in their stylistic and formatting choices and doesn't allow for much flexibility.
XO has many issues that ESLint and Prettier don't have.