There are some convenient rules that we use in our eslint config from eslint-config-airbnb. Unfortunately the project isn't really maintained anymore. Now we're migrating to eslint v9, which isn't supported by them. Did anyone go through a similar process when upgrading to eslint v9 and maybe find a good alternative, that gets 80%+ of the same rules?
Right now, I am leaning towards just dropping the package.
Videos
Just gathering some data and info on what “base” people extend their Eslint configs from.
I know Airbnb is a popular one but I am curious if that is because a lot of tutorials use it and that’s the path of least resistance for most folks, or if you have a specific reason you want to use it.
If you don’t use it, can you let me know why you don’t, and what you do use instead.
EDIT:
Many have asked why I care or assumed I am setting up linting for the first time. I am of the opinion that some of these giant configs obfuscate and abstract a large amount of the rules that you should care about, and create a level of abstraction from the packages that have the rules anyway. Case in point, Airbnb includes plugins for react and import. I think you can get 80% “airbnb” equivalency by installing these plugins yourself and extending from their recommended configs.
I am building an Eslint config compare tool which can take in two+ configs, and compare their rule sets, showing you where and how they differ.
» npm install @kesills/eslint-config-airbnb-typescript
I believe esint-config-airbnb is not compatible with the new eslint config at the moment.
However, you can still use it with the new eslint config through @eslint/eslintrc which is a backward compatibility utility provided by ESLint team.
There was a how-to guide on eslint's blog here https://eslint.org/blog/2022/08/new-config-system-part-2/#backwards-compatibility-utility.
Since 2025,
Airbnb flat config is still not supported by the airbnb and airbnb-base so I suggest trying this one instead: eslint-config-airbnb-extended. It’s really good, up-to-date, and supports new tools like import-x and stylistic. Plus, it has helpful CLI support too!
To get started, execute
npx create-airbnb-x-config
This tool will:
- Ask you some quick questions
- Auto-detect your package manager (npm/yarn/pnpm)
- Install all the things you need (or give you commands if you want to do it yourself)
- Give you a GitHub link with your custom config
- You copy → paste the config into your
eslint.config.mjsfile
Once you done with that, you can run eslint and it will automatically work.
Checkout: https://www.npmjs.com/package/eslint-config-airbnb-extended
Blog: https://medium.com/@iamnisharg/level-up-your-code-with-airbnbs-extended-eslint-configuration-f10be85c23fd
I think eslint-config-prettier was created just for this purpose: https://prettier.io/docs/en/eslint.html#turn-off-eslint-s-formatting-rules
Basically it turns off all rules that have to do with code styling because prettier will take care of it anyway.
So you just install this config along with any other desired eslint config (like eslint-config-airbnb) and in your eslint configuration file you just add it to the extends field. For example:
{
"extends": ["airbnb", "prettier"]
}
Here are a few ways to do it, in order of recommendation. I would prefer the first approach as you won't ever have to bother with other rules that might conflict in future.
1. Use eslint-config-prettier
Install eslint-config-prettier and extend from it in .eslintrc. Doing this turns off some of the formatting-related rules within ESLint that might conflict with Prettier:
{
"extends": [
"airbnb",
"prettier"
]
}
2. Modifying Prettier's config
Add "singleQuote": true to the .prettierrc config file:
{
"singleQuote": true,
...
}
3. Prettier CLI config
Add a --single-quote command line option when you invoke Prettier:
$ prettier --single-quote ...
4. Modify ESLint config
Turn off ESLint's quotes rule within your .eslintrc config file (and potentially others that might conflict):
{
"rules": {
"quotes": "off",
...
}
}