Airbnb stiilijuhend on juhiste kogum puhta ja järjepideva koodi kirjutamiseks. See ilmus 2012. aastal ja sellest ajast on saanud JavaScripti projektide üks populaarsemaid stiilijuhiseid.
See annab juhiste komplekti järjepideva koodi kirjutamiseks, mida on lihtne hooldada, rakendades erinevaid stiile reeglid taande, kommentaaride, rea maksimaalse pikkuse, muutujate nimetamise tavade, jutumärkide ja funktsioonide määratluste kohta. Airbnb stiilijuhendi seadistamiseks JavaScripti projektis peate kasutama lintimistööriista, näiteks ESLint.
Installige ESLint
ESLint on avatud lähtekoodiga JavaScript ebeme eemaldamise tööriist mis aitab arendajatel kirjutada puhast koodi, leides ja parandades probleeme. See võib tuvastada teie koodis probleeme, nagu süntaksivead, kehtetud parameetrid ja määratlemata muutujad. Kui käivitate ESLinti rakendusega - - paranda
silt, tuvastab ja parandab automaatselt kõik koodis olevad parandatavad probleemid, säästes sellega teie aega.Saate kasutada ESLinti stiilijuhiste, nagu Airbnb stiilijuhiste, jõustamiseks.
Alustamiseks käivitage terminalis järgmine käsk, et installida ESLint arendaja sõltuvusena:
npm install --save-dev eslint eslint-config-airbnb
Seejärel lähtestage ESLint.
npx eslint --init
Teilt küsitakse teie projekti kohta küsimusi. Kui küsitakse:
? Kuidas soovite EsLinti kasutada?
Valige see valik:
> Süntaksi kontrollimiseks, probleemide leidmiseks ja koodistiili jõustamiseks
Vastake järgmistele küsimustele vastavalt oma projektile, kuni näete järgmist viipa.
? Kuidas soovite oma projekti stiili määratleda?
Seejärel vastake järgmiselt.
> Kasutage populaarset stiilijuhendit
Järgmise viipa jaoks valige Airbnb stiilijuhend.
? Millist stiilijuhendit soovite järgida?
> Airbnb:
Lõpuks installige vajalikud sõltuvused, valides järgmises viibas „Jah”.
Kui installimine on lõppenud, peaks teil olema a .eslintsrc.json faili oma kausta juurtes.
Airbnb stiilijuhendi kohandamine
Airbnb stiilijuhend võimaldab kohandamist. Saate lisada täiendavaid reegleid või alistada olemasolevad reeglid .eslintsrc.json konfiguratsioonifail.
Näiteks maksimaalselt 80 tähemärgi lubamiseks rea kohta saate selle reegli lisada reeglite jaotisesse.
{
"pikendab": [
"plugin: reageeri/soovitatav",
"airbnb"
],
"reeglid": {
"max-len": ["viga", { "kood": 80 }]
}
}ESLinti käitamine failis package.json
Lisage skripti package.json faili ESLinti käivitamiseks.
"skriptid": {
"kibe": "eslint"
}
Käivitage lint-skript, et kontrollida, kas selle käsu käivitamisel on lint-tõrkeid.
npm jooksma lint
Saate lisada ka skripti koodi probleemide lahendamiseks, kasutades -- paranda lipp.
"skriptid": {
"kibe": "eslint",
"lint: paranda": "npm run lint -- --fix"
},
Jooksmine npm jooksev lint: paranda terminalis lahendab automaatselt kõik probleemid, mida linter suudab parandada.
Luba Linting VS-koodis salvestamisel
Skripti käivitamine iga kord, kui soovite koodi kokku panna, võib olla tüütu. Järgige allolevaid samme, et lubada VS Code'is salvestamisel linting.
- Avage VS-koodi akna vasakus servas vahekaart "Laiendused".
- Otsige üles ESLint laiendus ja installige see.
- Kui laiendus on installitud, avage VS-koodi sätted (Fail > Eelistused > Seaded või vajutades Ctrl +,).
- Otsige seadete redaktoris "kooditoimingud salvestamisel".
- Klõpsake valikul „Muuda saidil settings.json” ja lisage failile järgmised sätted settings.json faili.
{
"editor.codeActionsOnSave": {
"source.fixAll.eslint": tõsi
},
"eslint.validate": ["javascript"],
"eslint.run": "onSave",
}
See võimaldab ESLinti laiendusel teie koodi salvestamisel automaatselt parandada.
Stiilijuhendi kasutamise eelised
Stiilijuhendi nagu Airbnb stiilijuhendi kasutamise peamine eelis on see, et see aitab teil säilitada ühtset koodibaasi. See on meeskonnas kasulik, kuna arendajad saavad koodibaasi hõlpsalt mõista ja sellele kaasa aidata. Samuti aitab see jõustada parimaid tavasid ja vältida levinud kodeerimisvigu.