readme.md
January 3, 2026 ยท View on GitHub
eslint-config
My shared ESLint & Prettier configuration for projects
๐โโ๏ธ Made by @abhijithvijayan
โค๏ธ it? โญ๏ธ it on GitHub or Tweet about it.
Table of Contents
Features
The config includes these plugins by default:
- eslint-plugin-import-x
- eslint-plugin-jsx-a11y
- eslint-plugin-prettier
- eslint-plugin-react
- eslint-plugin-react-hooks
- typescript-eslint
- eslint-plugin-n
Installation
npm install --save-dev @abhijithvijayan/eslint-config
Install the required peer dependencies:
npm install --save-dev eslint eslint-config-prettier eslint-plugin-import-x eslint-plugin-prettier globals prettier
For TypeScript support, also install:
npm install --save-dev @typescript-eslint/eslint-plugin @typescript-eslint/parser typescript
For React support, also install:
npm install --save-dev eslint-plugin-jsx-a11y eslint-plugin-react eslint-plugin-react-hooks
For Node.js support, also install:
npm install --save-dev eslint-plugin-n
Usage
This package uses ESLint's flat config format. Create an eslint.config.js (or eslint.config.mjs) file in your project root:
import baseConfig from '@abhijithvijayan/eslint-config';
export default [
...baseConfig,
// your overrides
];
Other Configs
This config also exposes react, node, and typescript configs that I use often.
TypeScript
import typescriptConfig from '@abhijithvijayan/eslint-config/typescript';
export default [
...typescriptConfig,
// your overrides
];
Node.js
It is to be used in combination with the base config (recommended):
import baseConfig from '@abhijithvijayan/eslint-config';
import nodeConfig from '@abhijithvijayan/eslint-config/node';
export default [
...baseConfig, // or typescriptConfig
...nodeConfig,
// your overrides
];
React
It is to be used in combination with the base config (recommended):
import baseConfig from '@abhijithvijayan/eslint-config';
import reactConfig from '@abhijithvijayan/eslint-config/react';
export default [
...baseConfig, // or typescriptConfig
...reactConfig,
// your overrides
];
Optional
-
To lint your files, you can add the following scripts to your
package.json:"scripts": { "lint": "eslint .", "lint:fix": "eslint . --fix" }, -
Add files/directories to ignore in your
eslint.config.js:export default [ { ignores: ['node_modules', 'dist', '.yarn', '.pnp.js'], }, ...baseConfig, ];
Override
If you'd like to override eslint or prettier settings, you can add the rules in your eslint.config.js file:
import baseConfig from '@abhijithvijayan/eslint-config';
export default [
...baseConfig,
{
rules: {
'no-console': 'off',
'prettier/prettier': [
'error',
{
bracketSpacing: true,
printWidth: 120,
semi: true,
singleQuote: true,
tabWidth: 4,
trailingComma: 'all',
useTabs: false,
},
],
},
},
];
With VS Code
To show lint errors in your editor, you'll need to configure your editor.
-
Install the ESLint package
-
Install the Prettier package
-
Now we need to setup some VS Code settings via
Code/FileโPreferencesโSettings. It's easier to enter these settings while editing thesettings.jsonfile, so click the{}icon in the top right corner:"editor.formatOnSave": true, "[javascript]": { "editor.formatOnSave": false }, "[javascriptreact]": { "editor.formatOnSave": false }, "[typescript]": { "editor.formatOnSave": false }, "[typescriptreact]": { "editor.formatOnSave": false }, "editor.codeActionsOnSave": { "source.fixAll": "explicit", "source.fixAll.eslint": "explicit" }, "prettier.disableLanguages": ["javascript", "javascriptreact", "typescript", "typescriptreact"],
Issues
Looking to contribute? Look for the Good First Issue label.
๐ Bugs
Please file an issue here for bugs, missing documentation, or unexpected behavior.
TypeScript Config
- Shared TypeScript Configuration -
@abhijithvijayan/tsconfig
License
MIT ยฉ Abhijith Vijayan