Eslint
My Own Packages
- Install
yarn add eslint prettier -D
npx install-peerdeps --dev @gbrachetta/eslint-config
- Add to
package.json
"eslintConfig": {
"extends": "@gbrachetta/eslint-config"
},
"prettier": "@gbrachetta/prettier-config"
- To extend or overwrite configuration, add
// .eslintrc.json
{
"extends": "@gbrachetta/eslint-config",
"rules": {
// you can edit this configuration as usual
}
}
// .prettierrc.json
{
"@gbrachetta/prettier-config"
}
Previous Configuration
// package.json
{
"devDependencies": {
"babel-eslint": "^10.1.0",
"eslint": "^7.24.0",
"eslint-config-airbnb": "^18.2.1",
"eslint-config-prettier": "^8.2.0",
"eslint-plugin-import": "^2.22.1",
"eslint-plugin-jsx-a11y": "^6.4.1",
"eslint-plugin-prettier": "^3.4.0",
"eslint-plugin-react": "^7.23.2",
"eslint-plugin-react-hooks": "^4.2.0"
}
}
yarn add -D babel-eslint eslint eslint-config-airbnb eslint-config-prettier eslint-plugin-import eslint-plugin-jsx-a11y eslint-plugin-prettier eslint-plugin-react eslint-plugin-react-hooks
// .eslintrc.json
{
"env": {
"browser": true,
"commonjs": true,
"es2021": true,
"node": true
},
"parser": "babel-eslint",
"extends": [
"eslint:recommended",
"airbnb",
"airbnb/hooks",
"plugin:react/recommended",
"plugin:import/errors",
"plugin:import/warnings",
"plugin:jsx-a11y/recommended",
"plugin:react-hooks/recommended",
"prettier"
],
"globals": {
"Atomics": "readonly",
"SharedArrayBuffer": "readonly"
},
"parserOptions": {
"ecmaFeatures": {
"jsx": true
},
"ecmaVersion": 11,
"sourceType": "module"
},
"settings": {
"react": {
"version": "detect"
}
},
"plugins": [
"react",
"react-hooks"
],
"rules": {
"import/order": [
"error",
{
"groups": [
"builtin",
"external",
"parent",
"sibling",
"index"
],
"newlines-between": "always",
"alphabetize": {
"order": "asc",
"caseInsensitive": true
}
}
],
"sort-imports": [
"error",
{
"ignoreCase": false,
"ignoreDeclarationSort": false,
"ignoreMemberSort": false,
"memberSyntaxSortOrder": [
"all",
"multiple",
"single",
"none"
],
"allowSeparatedGroups": true
}
],
"react/no-unescaped-entities": 0,
"react/react-in-jsx-scope": 0,
"react/jsx-filename-extension": [
1,
{
"extensions": [
".js",
".jsx"
]
}
],
"react/display-name": 1
}
}
// .prettierrc.json
{
"arrowParens": "always",
"bracketSpacing": true,
"endOfLine": "lf",
"jsxBracketSameLine": false,
"jsxSingleQuote": false,
"parser": "babel",
"printWidth": 80,
"requirePragma": false,
"semi": true,
"singleQuote": false,
"tabWidth": 2,
"trailingComma": "all"
}
Backlinks
Knowledge Base
- [[eslint]]