Setup ESLint in TypeScript project
18 March 2022 (Updated 6 May 2024)
Install packages (remove eslint-config-prettier
if not using prettier):
npm i -D eslint @typescript-eslint/parser @typescript-eslint/eslint-plugin eslint-config-prettier
Init config file:
npx eslint --init
Edit config file:
module.exports = {
env: {
node: true,
},
extends: [
'eslint:recommended',
'plugin:@typescript-eslint/recommended',
'prettier',
],
parser: '@typescript-eslint/parser',
parserOptions: {
ecmaVersion: 'latest',
sourceType: 'module',
},
plugins: ['@typescript-eslint'],
rules: {},
}
Add NPM script:
"scripts": {
"lint": "eslint . --ext .js,.ts"
}
Run ESLint:
npm run lint
Setup eslint-plugin-unused-imports
Install package:
npm i -D eslint-plugin-unused-imports
Add to plugins
(keep other entries) in your ESLint config:
{
"plugins": ["unused-imports"]
}
Add the following to the rules
field:
"unused-imports/no-unused-imports": "warn",
"unused-imports/no-unused-vars": [
"warn",
{
"vars": "all",
"varsIgnorePattern": "^_",
"args": "after-used",
"argsIgnorePattern": "^_"
}
}
Setup eslint-plugin-simple-import-sort
Install package:
npm install --save-dev eslint-plugin-simple-import-sort
Configure .eslintrc
:
{
"plugins": ["simple-import-sort"],
"rules": {
"simple-import-sort/imports": "error",
"simple-import-sort/exports": "error"
},
"parserOptions": {
"sourceType": "module",
"ecmaVersion": "latest"
}
}
Tagged:
JavaScript tooling
Thanks for your comment 🙏. Once it's approved, it will appear here.
Leave a comment