Laikykite savo kodą švaresnį ir gražesnį

Kodo formatavimas atrodo nereikšminga tema, tačiau tai gali turėti įtakos jūsų kodo kokybei ir teisingumui, kaip valdoma jo versija ir kaip bendradarbiaujate su kitais. Jei nenorite pasinerti į išsamią informaciją apie tai, kur eina paskutiniai breketai, pabandykite perduoti problemą atvirojo kodo įrankiui „Prettier“.

Formatavimas

Programinės įrangos kūrimo komandos per visą istoriją sugaišo daugybę valandų ginčydamosi dėl maksimalaus linijos ilgio arba ties kuria linija turėtų eiti petnešos. Kad ir ką pasakytų asmeniniai pageidavimai, dauguma žmonių sutaria bent dėl ​​vieno dalyko: kodo formatas turėtų būti nuoseklus visame projekte.

„Prettier“ - tai priemonė, skirta tam pasiekti. Duokite jai kodą ir jis grąžins tą patį kodą, suformatuotą nuosekliai. „Prettier“ turi teksto redaktoriaus integraciją, komandinės eilutės įrankį ir internetinę demonstracinę versiją.

Tinkama kalba

Pirmiausia norėsite sužinoti, ar „Prettier“ suderinama su kalba ar kalbomis, su kuriomis paprastai dirbate. Šiuo metu „Prettier“ sutelkia dėmesį į pagrindinį kalbų rinkinį, daugiausia skirtą internetinių puslapių kūrimui, įskaitant:

• „JavaScript“
• HTML
• CSS
• Sasas
• Užsirašyk
• YAML

Taip pat yra atviras papildomų kalbų palaikymas naudojant papildinius.

Išbandykite gražesnį naudodamiesi internetine žaidimų aikštele

Prieš bandydami įdiegti „Prettier“, galbūt norėsite išsiregistruoti Žaidimų aikštelė. Naudodamiesi žiniatinklio sąsaja, galite įklijuoti kodą ir stebėti, kaip „Prettier“ jį transformuos. Tai puikus būdas susidaryti įspūdį apie tai, ką įrankis iš tikrųjų veikia, tačiau jis taip pat gali būti jūsų pagrindinis „Prettier“ naudojimo būdas, jei jūsų reikalavimai yra lengvesni.

Pagal numatytuosius nustatymus žaidimų aikštelė turėtų atrodyti kaip dvi pagrindinės teksto rengyklės skydeliai, vienas kairėje jūsų įvesties, kitas dešinėje, rodantis „Prettier“ išvestį. Iš pradžių pamatysite kodo pavyzdį, bet jūs galite tiesiog pašalinti visa tai ir įklijuoti į savo.

Pavyzdžiui, pabandykite įvesti šią „JavaScript“:

(funkcija ()
{
window.alert ('ok')
}())

Gražiau turėtų tai paversti:

(funkcija () {
window.alert ("ok");
})();

Atkreipkite dėmesį, kad pagal numatytuosius nustatymus gražesni pakeitimai apima:

• Konvertuojant vienkartines eilutes į dvigubas
• Pridedant dvitaškius
• Įtraukų pavertimas dviem erdvėmis

Apatiniame kairiajame kampe yra mygtukas, leidžiantis peržiūrėti parinktis. Pateikdami ankstesnį pavyzdį, pabandykite sureguliuoti skirtuko plotį, perjunkite --viena citata vėliava po Dažnasarba perjungiant - ne pusiau vėliava po „JavaScript“.

Konfigūruojamos parinktys

Gražiau save apibūdina kaip „nuomonę“, tyčinis dizaino pasirinkimas, kuris reiškia, kad dėl paprastumo ir nuoseklumo aukojama specifikos kontrolė. Jis skirtas jums nustatyti, tada pamiršti, o ne rūpintis kiekviena paskutine kodo formatavimo detale. (Jei norite rasti alternatyvą, kur kiekvienos paskutinės formatavimo detalės būtų žymiai smulkesnės, pabandykite eslint.)

Tačiau autoriai taip pat pripažįsta, kad kai kurie sprendimai turi funkcinį poveikį ne tik kaip atrodo kodas. Kai kurios parinktys, įskaitant kai kurias seniems tikslams, išlieka, todėl turėtumėte bent jau suprasti, ką jos daro, net jei „Prettier“ naudojate numatytojoje būsenoje.

Geriausias valdymo būdas Gražesni variantai yra išsaugoti juos konfigūracijos faile. Yra daug būdų, kaip tai sutvarkyti, bet pirmiausia sukurkite failą pavadinimu .pretierrc.json savo vietos projektų kataloge. Jame gali būti bet kuri palaikoma parinktis standartiniame JSON objekte, pvz.

{
„tabWidth“: 8
}

Tą patį konfigūracijos failą „Prettier“ perskaitys, nesvarbu, ar jį naudojate per komandinę eilutę, ar palaikomą teksto rengyklę.

Naudojant verpalus ar ppm, montavimas turėtų būti paprastas. Verpalams:

Gražiau pridėkite $ verpalus

Ir už npm:

$ npm įdiegti - visuotinai gražiau

Įdiegę „Prettier“ visame pasaulyje, turėtumėte galėti įvesti:

$ gražiau

Pagal numatytuosius nustatymus gausite pagalbos teksto ekraną, kuris patvirtins, kad įrankis įdiegtas ir veikia tinkamai.

Failo valymas

Norėdami suformatuoti failą, naudokite komandą, panašią į:

$ gražiau - parašykite failo pavadinimą.js

Tai perrašys originalų failą, kuris dažnai yra pats patogiausias būdas. Arba galite tiesiog norėti, kad gražiau veiktų kiekvienas projekto failas:

gražiau - parašyk.

„Gražesnė“ veiks visuose failuose, esančiuose dabartiniame kataloge, formatuodama visus atpažintus failus.

Rezultatą taip pat galite atspausdinti į standartinę išvestį, o ne pakeisti originalų failą, kuris leidžia išsaugoti išvestį į kitą failą arba peradresuoti jį kitur:

$ gražesnis test.js> test2.js

Failo tikrinimas

Norėdami gauti gražesnę ataskaitą apie savo kodo švarą, neatlikdami jokių pakeitimų, naudokite --patikrinti vėliava su vienu failo vardu arba su daugeliu:

gražiau - patikrinkite.

Pagal „Prettier“ konfigūraciją gausite kiekvieno failo, kuris neatitinka laukiamo formato, išvesties eilutę:

Tikrinamas formatavimas ...
[perspėti]. gražiau
[perspėti] .prettierrc.json
[įspėti] Kodo stiliaus problemos, rastos aukščiau (-iuose) faile (-uose). Pamiršote paleisti gražiau?

Komandinės eilutės parinktys

„Prettier“ standartinės parinktys yra prieinamos kaip komandinės eilutės parinktys, jei jų reikia. Štai pavyzdys, kaip --viena citata vėliava paveikia išvestį:

$ gražesnis tmp.js
funkcijos pavyzdys () {
console.log („labas, pasauli“);
}
$ gražiau - vienkartinė citata tmp.js
funkcijos pavyzdys () {
console.log ('labas, pasauli');
}

Gauti pagalbos

Komandų eilutės įrankis teikia informacinę pagalbą bet kuriai parinkčiai per --pagalba vėliava:

$ gražiau - padėkite kablelį
- traukimo kablelis 
Kai įmanoma, atspausdinkite kablelius, kai tai įmanoma.
Galiojančios parinktys:
es5 ES5 galiniai kableliai (objektai, masyvai ir kt.)
nėra Jokių kablelių.
visi gale esantys kableliai, kur tik įmanoma (įskaitant funkcijos argumentus).
Numatytasis: es5

Teksto rengyklės naudojimas

Įdiegę „Prettier“, galėsite jį naudoti įvairiais atvejais, atsižvelgdami į tai, kokį įrankių rinkinį jau naudojate. Yra tikimybė, kad naudojate teksto rengyklę. „Prettier“ turi apkaustus daugumai populiarių, todėl štai kaip galite nustatyti tris iš jų:

Ištaigingas tekstas

JsGražiau yra „Sublime Text“ papildinys, leidžiantis „Gražiau“ pasiekti redaktoriuje. Nors yra keli skirtingi „JsPrettier“ diegimo būdai, rekomenduojame naudoti „Package Control“ metodą. Jau turėsite įdiegti „Prettier“, tada atidarykite „Sublime Text“ komandų paletę ir pasirinkite „Package Control: Install Package“:

Tada ieškokite „jsprettier“ ir spustelėkite, jei norite įdiegti:

Įdiegę „JsPrettier“, dešiniuoju pelės mygtuku spustelėkite bet kurį atidarytą failą, kad jį suformatuotumėte. Taip pat galite nustatyti reikšmę auto_format_on_save į tiesa „JsPrettier“ nustatymuose, dėl kurių „JsPrettier“ automatiškai išvalys visus suderinamus failus, kai juos išsaugosite „Sublime Text“.

Atomas

„Atom“ diegimas labai panašus į „Sublime Text“: norėdami įdiegti, paprasčiausiai naudokite įmontuotą redaktoriaus paketų tvarkyklę gražesnis atomas:

Įdiegus, naudojimas yra įprastas: spartusis klavišas arba meniu elementas leidžia formatuoti failą pagal pareikalavimą, o „Atom“ nustatymas leidžia automatiškai paleisti „Prettier“, kai tik išsaugomas failas.

Vim

„Vim“ yra labai galingas, komandų eilutėmis pagrįstas redaktorius, netinka pradedantiesiems. Gražiau dirbti su „Vim“ yra pakankamai sudėtinga, tačiau tai vis tiek yra tik keli žingsniai:

mkdir -p ~ / .vim / pack / plugins / start
git klonas https://github.com/prettier/vim-prettier \
~ / .vim / pack / plugins / start / vim-gražesnis

„Git“ yra turbūt lengviausias būdas atsisiųsti reikalingus failus, tačiau bet kokiomis priemonėmis, leidžiančiomis gražiau patekti į tą pradinį katalogą turėtų atlikti darbą.

Įdiegus „Prettier“ automatiškai veiks, kai failas bus įrašytas į „vi“. Jį taip pat galima bet kada paleisti rankiniu būdu per Gražiau komanda:

Dėl to turėtų būti išvalytas failas:

Integruokite gražesnį į savo projektą

Tokio kodo formato, kaip „Prettier“, naudojimas gali padėti išlaikyti lengviau įskaitomą kodų bazę. Tai taip pat gali padėti išvengti diskusijų apie tai, kokį stilių naudoti koduojant - tiesiog perleiskite tuos sprendimus „Gražiau“!

Galiausiai galima nustatyti „git“ kablį, kuris užtikrins, kad kodas visada bus išvalytas, kai jis bus skirtas jūsų projekto saugyklai. Individualūs kūrėjai gali laisvai formatuoti kodą taip, kaip nori, tačiau centrinė kopija visada bus švari ir nuosekli.

nano vs. „Vim“: geriausi terminalo teksto redaktoriai, palyginti

Ieškote „Linux“ terminalo teksto redaktoriaus? Pagrindinis pasirinkimas yra tarp „Vim“ ir „nano“! Štai kaip jie lygina.

Apie autorių