Priporočena, 2024

Izbira Urednika

10 Izjemne razširitve oklepajev, ki jih resnično potrebujete

Brackets.io je pred kratkim izdal različico 1.2 z nekaj odličnimi novostmi, o katerih lahko preberete na njihovem blogu. Pripravili smo seznam 10 najboljših in najbolj uporabnih razširitev oklepajev (brez posebnega vrstnega reda), skupaj s popolnimi navodili za vsako razširitev.

Razširitve oklepajev

1.Kod zlaganja

Za razliko od mnogih drugih IDE-jev in urejevalnikov kode oklepaji privzeto nimajo možnosti za zlaganje kode. Z zlaganjem kode lahko preprosto strnete velike dele kode v eno vrstico. Razširitev kodnega zlaganja je na voljo na Githubu in upravljalniku razširitev oklepajev.

Kako uporabiti

Če želite zložiti katero koli ugnezdeno oznako, kliknite puščico navzdol levo od nadrejene oznake, kot je prikazano zgoraj. Enako načelo za Javascript ali katerokoli drugo obliko. Samo kliknite puščico navzdol na levi strani nadrejenega elementa, da zložite vse ugnezdene izjave v eno vrstico. Če želite razširiti, kliknite znak plus.

Številke vrstic prepognjenih vrstic so skrite, tako da je zlahka opaziti zložene črte, ko se osredotočate na kodo.

2. Lorem Pixel

Obstaja veliko načinov za ustvarjanje besedila rezervacijskega mesta, toda prednji spletni razvijalci pogosto potrebujejo posnetke. Namesto, da poskušate ustvariti prazno presledek, uporabite razširitev Lorem Pixel. Omogoča vam, da vstavite čudovite posnetke vseh velikosti, ki jih želite. Kul del o Lorem Pixel je, da vam omogoča, da izberete kategorijo, iz katere želite sliko.

Če to ni dovolj dobro, se slike zadrževalnika spreminjajo vsakič, ko ponovno naložite stran! Slike lahko pogosto razburijo barvne sheme, zato vam Lorem Pixel nudi tudi možnost »sivine«, če želite uporabiti samo slike b / w ograd. Ta podaljšek poganja lorempixel.com in je na voljo pri upravljalniku razširitev oklepajev.

Uporaba Lorem Pixel

Kako uporabiti

Ko namestite razširitev Lorem Pixel, se v podoknu podaljšanja prikaže logotip Lorem Pixel - kvadratek (okno na desni strani z gumbom za predogled v živo). Kliknite logotip, da odprete okno z nastavitvami. Nastavite želeno velikost slike in želeno kategorijo slik. Če želite sivinske slike, preverite možnost sivine. Kopirajte povezavo v odložišče in jo po potrebi uporabite ali pa jo vstavite v trenutni položaj kazalca.

3. Samodejni predpone

Dodajanje predpon za prodajalca vaši kodi je težavna. Razširitev Autoprefixer vam lahko prihrani veliko časa (in veliko dela!), Ker samodejno doda zahtevane predpone prodajalca k vaši kodi. Ne potrebuje nobene konfiguracije in vsakič, ko shranite kodo, posodobi vaše predpone. Izberete lahko tudi kodo in samodejno predpono, če želite.

Kako uporabiti

Če želite uporabljati funkcijo Autoprefixer, začnite pisati kodo brez predpone. Razširitev bo samodejno dodala predpono, takoj ko jo shranite. Za samodejno predpono izbrane kode najprej izberite kodo in nato zavihek Urejanje ⇒ Samodejna izbira predpone.

Samodejni predponec omogoča tudi dodajanje predponov po meri v njegovih nastavitvah. Če želite odpreti nastavitve razširitve: Uredi . Nastavitve samodejnega popravka.

Če želite imeti lepo, kaskadno, predpono, omogočite možnost Visual cascade v nastavitvah pripon.

4. Markdown Preview

Markdown je čudovit označevalni jezik, ki ga lahko preprosto pretvorite v HTML. Markdown predogled prikazuje opravljeno Markdown desno pod besedilno različico. Omogoča vam izbiro med dvema različnima slogoma, Github Flavored Markdown in Standard Markdown.

Obstajajo tri teme, ki jih lahko izberete za okno za predogled - Light, Dark in Classic. Markdown predogled ima tudi možnost sinhronizacije drsenja (privzeto je omogočeno). Razširitev lahko prenesete iz Githuba ali iz upravljalnika razširitev oklepajev.

Kako uporabiti

Odprite datoteko .md ali .markdown . Če imate nameščen Markdown Preview, se na desni strani prikaže gumb M ↓ . Kliknite ga in videli boste prikazano Markdown. Če želite spremeniti temo ali onemogočiti sinhronizacijo pomikanja, kliknite ikono zobnika v zgornjem desnem kotu razdelka Predogled predogleda.

5. Oklepaji Ikone

Vedno je zabavno začeti urejevalnik kod z ikonami datotek. Oklepaji Ikone dodajajo barvne ikone, ki temeljijo na vrsti datoteke, na vse datoteke, navedene v stranski vrstici. Ima ikone za večino vrst datotek in na strani Github lahko objavite zahteve za ikone.

Nasvet za bonus:

Oklepaji Ikone uporabljajo ikone iz projekta Ionicons. Ogledate si lahko tudi razširitev Datoteka Ikone (vilice projekta Ikone oklepajev), ki uporablja ikone iz projekta Font Awesome. Na koncu se zniža na osebne preference.

Kako uporabiti

Samo namestite razširitev in ponovno naložite oklepaje (F5).

6. Orodna vrstica dokumentov

Nosilci nimajo zavihkov. Preprosto in preprosto dejstvo. Razširitev orodne vrstice Documents doda to funkcionalnost. Vse datoteke, ki so v "aktivnem" delu stranske vrstice, so prikazane kot zavihki v tej razširitvi. Stransko vrstico lahko tudi skrijete in za lep vmesnik uporabite samo orodno vrstico Documents.

Kako uporabiti

Namestite podaljšek in ponovno naložite nosilce (F5).

7. Oklepaji Git

Vse se poskuša povezati z Gitom v teh dneh; je daleč najbolj priljubljen sistem za nadzor različic (VCS). Oklepaji Git je enostavno najboljši med podobnimi podaljški oklepajev. Ima vse funkcije, ki jih potrebujete. Spremembe lahko preprosto vnesete iz samih oklepajev, spremembe s pritiskom in izvlekom z enim samim klikom, ogled zgodovine datoteke in celotne zgodovine objave. Če uporabljate Git, ne boste našli nobenih težav s to razširitvijo.

Opomba: Če želite uporabiti oklepaje Git, morate imeti v računalniku nameščen Git. Po namestitvi razširitve boste morda morali vnesti pot do izvedljive datoteke Git (če ni na privzeti poti).

Kako uporabiti

Izdelava datoteke z oklepaji Git

Uporaba oklepajev Git je precej naravnost naprej. Naredite lokalno mapo Github repo mapo projekta v oklepajih. Nato odprite datoteko, naredite nekaj sprememb in jo shranite. Potem lahko nadaljujete in kliknete na ikono Git na desni strani in to bo odprlo podokno Gripets Git na dnu. Prikazal bo vse spremembe, ki ste jih naredili v svojih datotekah.

Preverite, katere datoteke želite objaviti, in kliknite gumb Objavi. To bo odprlo pojavno okno z navedenimi spremembami. Vnesite sporočilo Commit in kliknite V redu. Datoteko ste uspešno dodelili Git neposredno iz oklepajev!

Po opravljenem kliku kliknite gumb (prikaže tudi število nesinhroniziranih izvršitev, kot je prikazano v GIF zgoraj).

Konfiguriranje nastavitev

Odprite okno Brackets Git in kliknite gumb Nastavitve (drugi na desni). Proste nastavitve oklepajev Git lahko nastavite tako, kot vam je všeč.

Če si želite ogledati zgodovino datoteke in vnosa podatkov

Preprosto kliknite na ustrezne gumbe, da si ogledate zgodovino datotek in zgodovino uvrstitve, ki so lepo našteti. Ali smo omenili, da lahko spremenite avatar v črno-beli avatar, barvni avatar ali vaš Gravatar?

Objavi zgodovino

8. Prekini vse stvari

Svežo vse stvari. Vse. Ta razširitev poveže vse vaše datoteke naenkrat. Zelo koristno, če imate velik projekt z veliko povezanih datotek. Vse napake v lintih so lepo prikazane v podoknu.

Kako uporabiti

Če želite uporabiti Lint ALL Things, pojdite na zavihek View in kliknite Lint whole Project .

9. Oklepaji Todo

Oklepaji Todo je majhen podaljšek, ki prikazuje vse komentarje TODO v čistem formatu. Privzeto podpira 5 oznak - TODO, NOTE, FIXME, CHANGES in FUTURE. Komentarje lahko označite tudi kot Končano. V možnostih prikaza lahko filtrirate komentarje po oznakah. Oklepaji Todo vam omogočajo, da določite barve po meri za oznake in tudi lastne oznake, če boste kdaj želeli biti ustvarjalni s svojimi komentarji.

Če delate na velikem projektu in želite slediti komentarjem iz več datotek, lahko spremenite obseg iskanja v oklepajih Todo. Želite izključiti nekatere datoteke in mape, kot so mape prodajalcev? Brez skrbi. Dodajte pot na seznam izključitev. Nastavitve za vsak projekt lahko prilagodite z dodajanjem datoteke .todo v imenik korenskega projekta.

V github dokumentaciji lahko pregledate vse nastavitvene možnosti.

Kako uporabiti

Če želite uporabiti oklepaje Todo, dodajte komentar k kodi z oznako znotraj. Ime oznake mora biti veliko, sledi mu dvopičje (:). Če si želite ogledati vse Todo, kliknite ikono Todo v podoknu za podaljšanje desne strani.

Konfiguriranje:

  • Če želite omogočiti komentarje programa Todo za HTML: Samo odprite nastavitve - kliknite ikono Todo → Nastavitve (ikona zobnika) - in kliknite, da odprete datoteko .todo. V to datoteko dodajte to kodo:
     {"regex": {"predpona": "(? :)"}} 

    Kako izgleda meni z nastavitvami programa Todo
  • Če želite spremeniti obseg iskanja: dodajte to kodo v datoteko .todo:
     {"search": {"scope": "moj projekt"}} 
  • Če želite iz obsega iskanja izključiti katero koli datoteko / razširitev / datoteko: dodajte to kodo v datoteko .todo:
     {"search": {"scope": "moj projekt", 

    »Izključi mape«: [»tvoja mapa«]

     "excludeFiles": ["yourfile"] "excludeFiles": [".yourextension"]}} 

10. Uljepšajte

Beautify naredi vašo kodo dobro videti. Popravlja presledke, zareze in črte.

Kako uporabiti

To je zelo enostaven za uporabo Beautify. Vse kar morate storiti je, da izberete nekaj kode> Desni klik > Beautify .

Lahko pa se pomaknete na zavihek Urejanje in kliknete » Beautify «.

Top