Ръководството за стил на Airbnb е набор от насоки за писане на чист и последователен код. Той беше пуснат през 2012 г. и оттогава се превърна в едно от най-популярните ръководства за стил за JavaScript проекти.
Той предоставя набор от насоки за писане на последователен код, който е лесен за поддръжка чрез налагане на различни стилове правила за отстъпи, коментари, максимална дължина на реда, конвенции за именуване на променливи, кавички и дефиниции на функции. За да настроите ръководството за стил на Airbnb в JavaScript проект, трябва да използвате инструмент за linting като ESLint.
Инсталирайте ESLint
ESLint е JavaScript с отворен код инструмент за мъх който помага на разработчиците да пишат чист код, като намират и коригират проблеми. Може да открие проблеми във вашия код като синтактични грешки, невалидни параметри и недефинирани променливи. Когато стартирате ESLint с
- -поправи етикет, той автоматично идентифицира и коригира всички поправими проблеми в кода, като по този начин ви спестява време.Можете да използвате ESLint, за да наложите ръководства за стил като ръководството за стил на Airbnb.
За да започнете, изпълнете следната команда в терминала, за да инсталирате ESLint като зависимост от разработчици:
npm install --save-dev eslint eslint-config-airbnb
След това инициализирайте ESLint.
npx eslint --init
Ще бъдете подканени с въпроси относно вашия проект. Когато бъдете подканени с:
? Как бихте искали да използвате EsLint?
Изберете тази опция:
> За да проверите синтаксиса, да намерите проблеми и да наложите стил на код
Отговорете на следващите въпроси според вашия проект, докато не срещнете следната подкана.
? Как бихте искали да определите стил за вашия проект?
Тогава отговорете по следния начин.
> Използвайте популярно ръководство за стил
Изберете ръководството за стил на Airbnb за следващата подкана.
? Кое ръководство за стил искате да следвате?
> Airbnb:
И накрая, инсталирайте необходимите зависимости, като изберете „Да“ в следващата подкана.
След като инсталацията приключи, трябва да имате a .eslintsrc.json файл в корена на вашата папка.
Персонализиране на ръководството за стил на Airbnb
Ръководството за стил на Airbnb позволява персонализиране. Можете да добавите допълнителни правила или да замените съществуващите правила в .eslintsrc.json конфигурационен файл.
Например, за да разрешите максимум 80 знака на ред, можете да добавите това правило в секцията с правила.
{
"разширява": [
"плъгин: реагира/препоръчва се",
"airbnb"
],
"правила": {
"максимална дължина": ["грешка", { "код": 80 }]
}
}Изпълнение на ESLint в package.json
Добавете скрипт в package.json файл за стартиране на ESLint.
"скриптове": {
"мъхчета": "еслинт"
}
Стартирайте скрипта lint, за да проверите за грешки при linting, като изпълните тази команда.
npm изпълнява линт
Можете също да добавите скрипт за отстраняване на проблеми в кода, като използвате --поправи знаме.
"скриптове": {
"мъхчета": "еслинт",
"мъх: корекция": "npm run lint -- --fix"
},
бягане npm run lint: корекция на терминала автоматично ще коригира всички проблеми, които Linter може да коригира.
Активирайте Linting при запазване във VS Code
Стартирането на скрипт всеки път, когато искате да нарисувате кода си, може да стане досадно. Следвайте стъпките по-долу, за да активирате linting при запис във VS Code.
- Отидете в раздела „Разширения“ от лявата страна на прозореца на VS Code.
- Търсене на Разширение ESLint и го инсталирайте.
- След като разширението е инсталирано, отворете настройките на VS Code (Файл > Предпочитания > Настройки или като натиснете Ctrl +,).
- В редактора на настройките потърсете „действия на кода при запазване“.
- Щракнете върху „Редактиране в settings.json“ и добавете следните настройки към settings.json файл.
{
"editor.codeActionsOnSave": {
"source.fixAll.eslint": вярно
},
"eslint.validate": ["javascript"],
"eslint.run": "onSave",
}
Това позволява на разширението ESLint автоматично да коригира вашия код, когато записвате.
Ползи от използването на ръководство за стил
Основното предимство от използването на ръководство за стил като ръководството за стил на Airbnb е, че ви помага да поддържате последователна кодова база. Това е полезно в екип, тъй като разработчиците могат лесно да разберат и да допринесат за кодовата база. Освен това ви помага да наложите най-добрите практики и да избегнете често срещани грешки при кодирането.