$ yarn add --dev --exact @babel/core @babel/eslint-parser @babel/eslint-plugin eslint prettier \
eslint-config-airbnb eslint-config-prettier eslint-plugin-import \
eslint-plugin-jest eslint-plugin-jest-formatting \
eslint-plugin-json eslint-plugin-jsx-a11y eslint-plugin-prettier \
eslint-plugin-react eslint-plugin-react-hooks eslint-config-kyt
# or
$ npm i --save-dev --save-exact @babel/core @babel/eslint-parser @babel/eslint-plugin eslint prettier \
eslint-config-airbnb eslint-config-prettier eslint-plugin-import \
eslint-plugin-jest eslint-plugin-jest-formatting \
eslint-plugin-json eslint-plugin-jsx-a11y eslint-plugin-prettier \
eslint-plugin-react eslint-plugin-react-hooks eslint-config-kytAdd to the extends section of your ESLint configuration:
.eslintrc(.json):
{
"extends": ["kyt"],
"rules": {}
}.eslintrc.js:
module.exports = {
extends: ['kyt'],
// shorthand: ['kyt']
rules: {
/* If you must, override rules here :P */
},
};To add a subset of rules, you can specify one of the following:
module.exports = {
extends: [
// extends airbnb/base and contains all of our custom rules
'kyt/base',
// adds `jest` and `jest-formatting` plugins
'kyt/jest',
// adds Airbnb's React rules before our custom rules
'kyt/react',
// all rules
'kyt',
],
};yarn eslint . --fixOr add to your package.json:
{
"scripts": {
"lint": "eslint .",
"lint-fix": "eslint . --fix"
}
}To automatically format your code based on these rules during development, install a package for your IDE. We recommend that you install and configure ESLint with one of the following editors:
- go to View > Extensions
- Install
ESLint - Install
Prettier - Go to
Code > Preferences - Change the following preferences to
true:
"prettier.eslintIntegration": true,
"editor.formatOnSave": true
- Go to
Preferences > Install - Install
linter - Install
linter-eslint - Install
prettier-atom. In theprettier-atomsettings, check theESLint Integrationcheckbox. - Make sure all packages are enabled. You may need to restart Atom.