Brackets.io julkaisi äskettäin version 1.2, jossa on hienoja uusia ominaisuuksia, joita voit lukea blogistaan. Olemme laatineet luettelon 10 parhaasta ja hyödyllisimmästä Brackets-laajennuksesta (ei erityisessä järjestyksessä) sekä täydelliset ohjeet jokaisesta laajennuksesta.
Brackets Extensions
1.Koodi Taitto
Toisin kuin monet muut IDE-koodit ja koodieditorit, haarukoissa ei ole oletusarvoisesti koodin taittoasetusta. Code Folding -toiminnolla voit helposti koota suuria osia koodista yhteen riviin. Koodin taitto-laajennus on saatavana Githubissa ja Brackets-laajennushallinnassa.
Kuinka käyttää
Napsauta minkä tahansa sisäkkäisen tagin napsauttamalla yläpuolella olevaa nuolta vanhemerkin vasemmalla puolella kuten edellä on esitetty. Sama periaate Javascriptiin tai muuhun muotoon. Napsauta vanhemman elementin vasemmalla puolella olevaa alanuolta, kun haluat taittaa kaikki sisäkkäiset lausumat yhteen riviin. Voit laajentaa napsauttamalla plusmerkkiä.
Taitettujen viivojen rivinumerot ovat piilotettuja, joten taitetut viivat on helppo havaita, kun keskität koodiin.
2. Lorem Pixel
On paljon tapoja luoda paikkamerkkitekstiä, mutta etupään web-kehittäjät tarvitsevat usein paikkamerkkikuvia. Sen sijaan, että yrität luoda tyhjän paikkamerkkikuvan, käytä Lorem Pixel -laajennusta. Sen avulla voit lisätä upeita paikkamerkkikuvia mihin tahansa kokoon. Viileä osa Lorem Pixelistä on, että voit valita luokan, josta haluat kuvan.
Jos tämä ei ole tarpeeksi hyvä, paikkamerkkikuvat muuttuvat aina, kun lataat sivun uudelleen! Kuvat voivat usein häiritä värimaailmaa, joten Lorem Pixel antaa myös harmaasävy-vaihtoehdon käyttää vain b / w-paikkamerkkikuvia. Laajennusta tukee lorempixel.com ja se on saatavana Brackets-laajennusten hallintaohjelmassa.
Kuinka käyttää
Kun olet asentanut Lorem Pixel -laajennuksen, Lorem Pixel -logo - valittu neliö - näkyy laajennusruudussa (Oikean esikatselun painikkeella oleva ruutu). Tuo asetusruutu napsauttamalla logoa. Aseta haluamasi kuvakoko ja haluamasi kuvaluokka. Jos haluat harmaasävyisiä kuvia, tarkista harmaasävy-vaihtoehto. Kopioi linkki leikepöydälle ja käytä sitä tarvittaessa tai lisää nykyiseen kohdistimen sijaintiin.
3. Autoprefikseri
Toimittajan etuliitteiden lisääminen koodiin on drudgery. Autoprefixer-laajennus voi säästää paljon aikaa (ja paljon työtä!), Koska se lisää automaattisesti tarvittavat toimittajan etuliitteet koodiin. Se ei tarvitse mitään kokoonpanoa, ja päivittää etuliitteesi aina, kun tallennat koodin. Voit myös valita koodin ja automaattisen etuliitteen, jos haluat.
Kuinka käyttää
Jos haluat käyttää Autoprefixer-ohjelmaa, aloita vain prefiksitön koodi. Laajennus lisää automaattisesti etukäteen koodin heti, kun tallennat. Jos haluat valita etukäteen jonkin valitun koodin, valitse ensin koodi ja sitten Muokkaa- välilehti ⇒ Automaattinen etuliitteen valinta.
Autoprefixerin avulla voit myös lisätä mukautettuja etuliitteitä asetuksiinsa. Siirry laajennusasetuksiin: Muokkaa ⇒ Autoprefikserin asetukset.
Jos haluat käyttää kauniita, porrastettuja, etuliitteitä, ota Visual Cascade -vaihtoehto käyttöön laajennusasetuksissa.
4. Markdown-esikatselu
Markdown on ihana pelkkä tekstimerkintäkieli, joka on helposti muunnettavissa HTML-muotoon. Markdown-esikatselu antaa renderoidun Markdownin suoraan tekstiversiolle. Sen avulla voit valita kahden eri tyylin välillä: Github Flavored Markdown ja Standard Markdown.
Esikatseluikkunassa voit valita kolme teemaa: Light, Dark ja Classic. Markdown-esikatselussa on myös vierityssynkronointi (oletuksena käytössä). Laajennus voidaan ladata Githubista tai Brackets-laajennusten hallintaohjelmasta.
Kuinka käyttää
Avaa .md tai .markdown- tiedosto. Jos olet asentanut Markdown-esikatselun, M ↓ -painikkeen pitäisi näkyä oikealla. Napsauta sitä, ja näet renderoidun Markdownin. Jos haluat vaihtaa teeman tai poistaa synkronoinnin, napsauta vain kuvaketta Markdown Preview -osan oikeassa yläkulmassa.
5. Sulujen kuvakkeet
On aina hauskaa tuoda koodieditori tiedostojen kuvakkeisiin. Suluissa olevat kuvakkeet lisäävät värillisiä kuvakkeita tiedostotyypin mukaan kaikkiin sivupalkissa lueteltuihin tiedostoihin. Siinä on kuvakkeet useimmille tiedostotyypeille, ja voit lähettää kuvakyselyjä Github-sivulle.
Bonusvinkki:
Sulujen kuvakkeet käyttävät Ionicons-projektin kuvakkeita. Voit myös tarkistaa laajennuksen Tiedostokuvakkeet (haarukoiden kuvakkeen projektin haarukan), joka käyttää Font Awesome-projektin kuvakkeita. Se kiehuu henkilökohtaisiin mieltymyksiin.
Kuinka käyttää
Asenna vain laajennus ja latauslaitteet (F5).
6. Asiakirjojen työkalurivi
Suluissa ei ole välilehtiä. Yksinkertainen ja yksinkertainen tosiasia. Asiakirjatyökalupalkin laajennus lisää tämän toiminnon. Kaikki tiedostot, jotka ovat sivupalkin aktiivisessa osassa, näkyvät tämän laajennuksen välilehdinä. Voit myös piilottaa sivupalkin ja käyttää vain dokumenttien työkaluriviä mukavan käyttöliittymän luomiseksi.
Kuinka käyttää
Asenna laajennus ja uudelleenlatauskiinnikkeet (F5).
7. Kiinnikkeet Git
Kaikki yrittää integroida Gitiin näinä päivinä; se on ylivoimaisesti suosituin versionhallintajärjestelmä (VCS). Kannattimet Git on helposti paras samankaltaisten kiinnikkeiden laajennusten joukossa. Siinä on kaikki tarvitsemasi git-ominaisuudet. Voit helposti tehdä muutoksia suluissa itsestään, työntää ja vetää muutoksia yhdellä napsautuksella, tarkastella tiedoston historiaa ja kokonaissitoumuksia myös historiaan. Jos olet hyvä Gitillä, et löydä mitään tämän laajennuksen ongelmia.
Huomautus: Jos haluat käyttää Brackets Git -ohjelmaa, tietokoneeseen on asennettava Git. Kun olet asentanut laajennuksen, sinun on ehkä syötettävä Git-suoritettavan tiedoston polku (jos se ei ole oletuspolulla).
Kuinka käyttää
Kannattimien käyttäminen Git on melko suoraviivaista. Tee paikallinen Github-repo-kansio projektikansioksi suluissa. Avaa tiedosto, tee muutoksia ja tallenna se. Sitten voit mennä eteenpäin ja napsauttaa oikealla olevaa Git-kuvaketta, joka avaa alareunassa olevat Brackets Git -ikkunan. Siinä luetellaan kaikki muutokset, jotka olet tehnyt tiedostoihisi.
Tarkista, mitä tiedostoja haluat tehdä, ja napsauta sitten Commit-painiketta. Tämä avaa ponnahdusikkunan tehdyistä muutoksista. Anna Commit-viesti ja napsauta OK. Ja olet onnistuneesti tehnyt tiedoston Gitille suoraan Bracketsistä!
Kun olet sitoutunut, klikkaa vain painiketta (se näyttää myös synkronoimattomien sitoumusten määrän, kuten yllä olevassa GIF: ssä näkyy).
Asetusten määrittäminen
Avaa Brackets Git -ruutu ja napsauta Settings-painiketta (toinen oikealla). Voit vapaasti määrittää Brackets Git -asetuksen joka tapauksessa.
Voit tarkastella tiedosto- ja sitoutumishistoriaa
Napsauta vastaavia painikkeita nähdäksesi tiedostosi historiaa ja sitoutumishistoriaa kauniisti. Mainitsimmeko, että voit muuttaa avatarin mustaksi ja valkoiseksi avatariksi, värilliseksi avatariksi tai Gravatariksi?
8. Lint KAIKKI asiat
Lint KAIKKI asiat. Kaikki. Tämä laajennus näyttää kaikki tiedostosi kerralla. Erittäin hyödyllinen, kun sinulla on suuri projekti, jossa on paljon liitettyjä tiedostoja. Kaikki nukka-virheet näkyvät hyvin ruudussa.
Kuinka käyttää
Jos haluat käyttää Lint ALL Things -ohjelmaa, siirry Näytä- välilehdelle ja valitse Lint koko projekti .
9. Sulkimet Todo
Brodeet Todo on siisti pieni laajennus, joka näyttää kaikki TODO-kommentit siistissä luettelomuodossa. Oletuksena se tukee 5 tagia - TODO, HUOMAUTUS, FIXME, MUUTOKSET ja TULEVAISUUS. Voit myös merkitä kommentit Valmis-tilaan. Näyttöasetuksissa voit suodattaa kommentteja tunnisteilla. Sulkimet Todo avulla voit määrittää mukautettuja värejä tunnisteille ja myös omille tunnisteillesi, jos haluatte koskaan luovuttaa kommentteihisi.
Jos työskentelet suuren projektin parissa ja sinun täytyy seurata kommentteja useista tiedostoista, voit muuttaa Brackets Todon haun laajuutta. Haluatko sulkea joitakin tiedostoja ja kansioita, kuten toimittajan kansioita? Ei huolia. Lisää vain polku poissulkemisluetteloon. Voit muokata kunkin projektin asetuksia lisäämällä .todo-tiedoston juurihankkeen hakemistoon.
Voit käydä läpi kaikki asetukset github-dokumentaatiossa.
Kuinka käyttää
Jos haluat käyttää Brackets Todo -ohjelmaa, lisää vain kommentti koodiin, jossa on tunniste. Tunnisteen nimen on oltava isoja kirjaimia ja sen jälkeen kaksoispiste (:). Voit tarkastella kaikkia Todo-ohjelmia napsauttamalla oikeassa reunassa olevaa Todo-kuvaketta.
määrittäminen:
- Voit sallia Todon HTML-kommentteja: Avaa vain asetukset - Napsauta Todo-kuvaketta → Asetukset (vaihdekuvake) - ja avaa .todo-tiedosto napsauttamalla. Lisää tämä tiedosto tähän koodiin:
{"regex": {"etuliite": "(? :)"}}
- Hakukentän muuttaminen: Lisää tämä koodi .todo-tiedostoon:
{"search": {"soveltamisala": "projekti"}} - Jos haluat poistaa minkä tahansa tiedoston / kansion / tiedostopääte haun laajuudesta: Lisää tämä koodi .todo-tiedostoon:
{"search": {"soveltamisala": "hanke","Sulje kansiot": ["sinun kansiosi"]
"sulkeeFiles": ["yourfile"] "suljetaanFiles": [".yourextension"]}}
10. Koristele
Kaunista tekee koodistasi hyväksi. Se korjaa tilat, syvennykset ja viivat.
Kuinka käyttää
Beautify on erittäin helppokäyttöinen. Sinun tarvitsee vain valita jokin koodi> Oikea napsautus > Koristele .
Vaihtoehtoisesti voit siirtyä Muokkaa- välilehteen ja napsauttaa " Kauniita ".
