EditorConfig допомагає підтримувати єдиний набір правил. Щоб усі члени команди користувалися єдиними налаштуваннями, що стосуються відступів або символів переводу рядка тощо, застосовують файл .editorconfig
[*]
end_of_line = lf
charset = utf-8
trim_trailing_whitespace = true
insert_final_newline = true
max_line_length = 80
ESLint - Find and fix problems in your JavaScript code.
ESLint — це статичний аналізатор коду для знаходження проблемних ділянок, які не відповідають керівництву по стилю.
npm install eslint --save-dev
"scripts": {
...
"lint": "eslint './src/**/*.{js,jsx}'"
},
// .eslintrc
{
"env": {
"browser": true,
"node": true
},
"extends": ["react-app", "airbnb"],
"parserOptions": {
"ecmaVersion": 2018,
"sourceType": "module",
"ecmaFeatures": {
"jsx": true
},
},
"rules": { ... },
}
Prettier — це інструмент для форматування коду, який націлений на використання жорстко заданих правил.
npm i -D prettier eslint-config-prettier
eslint-config-prettier - Вимикає всі правила, які можуть кофліктувати з Pretier
{
...
"extends": ["react-app", "airbnb", "prettier"], // eslint-config-prettier
"plugins": ["react"],
...
"rules": {
...
"react/jsx-filename-extension": [1, { "extensions": [".js", ".jsx"] }]
...
}
}
Husky improves your commits and more 🐶 woof!
npx husky-init && npm install
Добавляем хуки и испольняемые команды:
Додаємо хуки та команди які треба виконати:
npx husky add .husky/pre-commit "npm run lint"
або рученятами у файліку .husky/pre-commit
Run linters against staged git files and don't let 💩 slip into your code base!
npm install --save-dev lint-staged
.husky/pre-commit
#!/bin/sh
. "$(dirname "$0")/_/husky.sh"
npx lint-staged
package.json
...
"lint-staged": {
"src/**/*.{js,jsx}": [
"prettier --write",
"eslint"
],
},
...