ESLint configuration for react projects, using Typescript.
Motivation
A single config for all React projects using TypeScript, which can be quickly connected to the project, in place of local configuration files in each project, which causes a discrepancy in styling or syntax checking on projects.
Description
This configuration uses configurations from airbnb for React hooks and TypeScript.
Plugins are also used:
- eslint-plugin-sonarjs - to identify duplicated code that should be avoided;
- eslint-plugin-import - to support the ES2015 + (ES6+) import / export syntax and prevent problems with incorrect spelling of file paths and import names.
- eslint-plugin-promise - plugin that will help you write the right promises and protect you from typical errors when working with them.
- eslint-plugin-jsx-a11y - will make you write HTML that will meet accessibility standards much better. Your projects will become much more convenient for people with disabilities.
- eslint-plugin-prettier - plugin that connects prettier, a code formatting tool that aims to use hard-coded rules for the design of programs.
Install
- First, we install the package and its dependencies
yarn add eslint-config-delaweb@^2.0.0 --dev
yarn add @typescript-eslint/eslint-plugin@^4.29.3 --dev
yarn add @typescript-eslint/parser@^4.29.3 --dev
yarn add eslint@^7.32.0" --dev
- Adding the configuration to the extends of your configuration file
module.exports = {
extends: ['delaweb']
}
- If you have the path function configured in tsconfig, you must specify the path to the configuration file in which the function was described
module.exports = {
extends: ['delaweb'],
parserOptions: {
project: './tsconfig.paths.json',
}
}
Maintainers
- Andrey Kobetz - @andrey45