Airbnb stilski vodič skup je smjernica za pisanje čistog i dosljednog koda. Objavljen je 2012. i od tada je postao jedan od najpopularnijih stilskih vodiča za JavaScript projekte.
Pruža skup smjernica za pisanje dosljednog koda koji je lako održavati provođenjem različitih stilova pravila o uvlakama, komentarima, maksimalnoj duljini retka, konvencijama o imenovanju varijabli, navodnicima i definicijama funkcija. Da biste postavili stilski vodič za Airbnb u JavaScript projektu, morate koristiti alat za linting kao što je ESLint.
Instalirajte ESLint
ESLint je JavaScript otvorenog koda alat za linting koji pomaže programerima da napišu čisti kod pronalaženjem i rješavanjem problema. Može otkriti probleme u vašem kodu kao što su sintaktičke pogreške, nevažeći parametri i nedefinirane varijable. Kada pokrenete ESLint s - -popraviti oznaku, automatski identificira i popravlja sve popravljive probleme u kodu čime vam štedi vrijeme.
Možete koristiti ESLint za provedbu stilskih vodiča poput Airbnb stilskog vodiča.
Da biste započeli, pokrenite sljedeću naredbu u terminalu da instalirate ESLint kao ovisnost o razvojnom programu:
npm instalacija --save-dev eslint eslint-config-airbnb
Zatim inicijalizirajte ESLint.
npx eslint --init
Od vas će se tražiti pitanja o vašem projektu. Kada se od vas zatraži:
? Kako želite koristiti EsLint?
Odaberite ovu opciju:
> Za provjeru sintakse, pronalaženje problema i nametanje stila koda
Odgovorite na sljedeća pitanja prema svom projektu dok ne naiđete na sljedeći upit.
? Kako biste željeli definirati stil za svoj projekt?
Zatim odgovorite na sljedeći način.
> Koristite popularni stilski vodič
Odaberite Airbnb stilski vodič za sljedeći upit.
? Koji stilski vodič želite slijediti?
> Airbnb:
Na kraju, instalirajte potrebne ovisnosti odabirom "Da" u sljedećem upitu.
Kada instalacija završi, trebali biste imati a .eslintsrc.json datoteku u korijenu vaše mape.
Prilagodba Airbnb stilskog vodiča
Airbnb stilski vodič omogućuje prilagodbu. Možete dodati dodatna pravila ili nadjačati postojeća pravila u .eslintsrc.json konfiguracijska datoteka.
Na primjer, da biste dopustili najviše 80 znakova po retku, možete dodati ovo pravilo u odjeljak pravila.
{
"proširuje": [
"plugin: reagirati/preporučeno",
"airbnb"
],
"pravila": {
"max-len": ["greška", { "kodirati": 80 }]
}
}Pokretanje ESLint-a u package.json
Dodajte skriptu u paket.json datoteku za pokretanje ESLint.
"skripte": {
"dlahice": "eslint"
}
Izvođenjem ove naredbe pokrenite lint skriptu kako biste provjerili ima li grešaka u lintingu.
npm run lint
Također možete dodati skriptu za rješavanje problema u kodu pomoću --popraviti zastava.
"skripte": {
"dlahice": "eslint",
"lint: popraviti": "npm run lint -- --fix"
},
Trčanje npm run lint: popravi na terminalu će automatski popraviti sve probleme koje Linter može riješiti.
Omogući Linting pri spremanju u VS kodu
Pokretanje skripte svaki put kada želite iscrtati svoj kod može postati zamorno. Slijedite korake u nastavku kako biste omogućili linting prilikom spremanja u VS Code.
- Idite na karticu "Proširenja" na lijevoj strani prozora VS koda.
- Potražite ESLint proširenje i instalirajte ga.
- Nakon što je proširenje instalirano, otvorite postavke VS koda (Datoteka > Postavke > Postavke ili pritiskom na Ctrl +,).
- U uređivaču postavki potražite "akcije koda pri spremanju".
- Kliknite "Uredi u settings.json" i dodajte sljedeće postavke u postavke.json datoteka.
{
"editor.codeActionsOnSave": {
"source.fixAll.eslint": pravi
},
"eslint.validate": ["javascript"],
"eslint.run": "onSave",
}
To omogućuje proširenju ESLint da automatski popravi vaš kod kada ga spremite.
Prednosti korištenja stilskog vodiča
Glavna prednost korištenja stilskog vodiča kao što je Airbnb stilski vodič je ta što vam pomaže u održavanju dosljedne baze kodova. Ovo je korisno u timu jer programeri mogu lako razumjeti i pridonijeti bazi koda. Također vam pomaže u provođenju najboljih praksi i izbjegavanju uobičajenih pogrešaka kodiranja.