Brackets.io vydaná verzia 1.2 nedávno, s niektorými skvelými novými funkciami, ktoré si môžete prečítať na svojom blogu. Zostavili sme zoznam desiatich najlepších a najužitočnejších rozšírení Brackets tam (v žiadnom konkrétnom poradí) spolu s kompletnými pokynmi pre každé rozšírenie.
Rozšírenia zátvoriek
1.Kódové skladanie
Na rozdiel od mnohých iných IDE a editorov kódov Základy nemá predvolenú možnosť sklonu kódu. S kódom skladania môžete jednoducho zbaliť veľké časti kódu do jedného riadku. Rozšírenie kódového skladu je k dispozícii na stránkach Github a Správca rozšírení konzoly.
Ako použiť
Ak chcete sklopiť vstavanú značku, stačí kliknúť na šípku nadol naľavo od nadradenej značky, ako je uvedené vyššie. Rovnaký princíp pre Javascript alebo iný formát. Stačí kliknúť na šípku nadol vľavo od nadradeného prvku a zložiť všetky vnorené príkazy do jedného riadku. Ak chcete rozšíriť, stačí kliknúť na znamienko plus.
Čísla riadkov preložených riadkov sú skryté, takže pri sústredení sa na kód ľahko uvidíte zložené čiary.
2. Lorem Pixel
Existuje veľa spôsobov, ako generovať zástupný text, no weboví vývojári na koncových stránkach často potrebujú obrázky so zástupnými znakmi. Namiesto toho, aby ste sa pokúsili vytvoriť prázdny zástupný symbol, použite rozšírenie Lorem Pixel. Umožňuje vám vložiť nádherné zástupné obrázky ľubovoľnej veľkosti, ktoré chcete. Chladná časť o Lorem Pixeli je, že vám umožňuje vybrať kategóriu, z ktorej chcete obrázok.
Ak to nie je dostatočne dobré, obrázky sa pri každom načítaní stránky stále menia. Obrázky môžu často narúšať farebné schémy, takže Lorem Pixel vám tiež poskytuje možnosť "odtieňov sivej", aby ste mohli používať iba prázdne obrázky. Toto rozšírenie je napájané spoločnosťou lorempixel.com a je k dispozícii v manažéroch rozšírení konzoly.
Ako použiť
Po nainštalovaní rozšírenia Lorem Pixel sa na predlžovacom paneli (pravý panel s tlačidlom Live Preview) zobrazí logo Lorem Pixel - zaškrtnuté štvorec. Kliknutím na logo zobrazíte okno s nastaveniami. Nastavte požadovanú veľkosť záberu a preferovanú kategóriu obrázkov. Ak chcete obrázky v odtieňoch šedej, skontrolujte možnosť odtieňov sivej. Buď skopírujte odkaz do schránky a použite ju podľa potreby alebo vložte do aktuálnej pozície kurzora.
3. Autoprefixer
Pridanie predpôn predajcu do vášho kódu je špinavý. Rozšírenie Autoprefixer vám môže ušetriť veľa času (a veľa práce!), Pretože automaticky pridá požadované predpony predajcov do vášho kódu. Nepotrebuje žiadnu konfiguráciu a aktualizuje vaše predpony pri každom uložení kódu. Môžete si tiež vybrať kód a automatickú predponu, ak chcete.
Ako použiť
Ak chcete použiť Autoprefixer, stačí začať písať bezprimárny kód. Rozšírenie automaticky pridá predplatený kód hneď, ako uložíte. Ak chcete prefixovať nejaký vybraný kód, najskôr zvoľte kód a potom kartu Upraviť ⇒ voľba Auto prefixu.
Služba Autoprefixer vám tiež umožňuje pridať vlastné predpony do svojich nastavení. Ak chcete prejsť na nastavenia rozšírenia: Upraviť ⇒ Nastavenia Autoprefixer.
Ak chcete mať krásny kaskádový predpripravený kód, povoľte voľbu Vizuálna kaskáda v nastaveniach rozšírenia.
4. Náhľad na značku
Markdown je krásny textový značkovací jazyk, ktorý je ľahko konvertovateľný na HTML. Náhľad na značku poskytuje vykreslené značkovanie priamo pod textovou verziou. Môžete si vybrať medzi dvoma rôznymi štýlmi, Github Flavored Markdown a Standard Markdown.
Existujú tri témy, ktoré si môžete vybrať pre okno s ukážkou - Light, Dark, and Classic. Náhľad na značkovanie má tiež možnosť synchronizácie posúvania (v predvolenom nastavení je povolená). Rozšírenie môžete prevziať z aplikácie Github alebo z manažéra rozšírení konzoly.
Ako použiť
Otvorte súbor .md alebo .markdown . Ak ste nainštalovali náhľad na značku, na pravej strane by sa malo zobraziť tlačidlo M ↓ . Kliknite na ňu a zobrazí sa vykreslená značka Markdown. Ak chcete zmeniť tému alebo zakázať synchronizáciu posúvania, stačí kliknúť na ikonu ozubeného kolieska v pravom hornom rohu sekcie Náhľad na značku.
5. Ikony konzoly
Je vždy zábavné upraviť editor kódov pomocou ikon súborov. Konzoly Ikony pridávajú farebné ikony založené na type súboru na všetky súbory uvedené na bočnom paneli. Má ikony pre väčšinu typov súborov a na stránke Github môžete odosielať požiadavky na ikony.
Bonus Tip:
Ikony konzoly používajú ikony z projektu Ionicons. Môžete tiež skontrolovať rozšírenie Ikony súboru (vidlica projektu Ikony konzoly), ktorá používa ikony z projektu Font Awesome. V konečnom dôsledku klesá na osobné preferencie.
Ako použiť
Stačí nainštalovať rozšírenie a opätovne načítať konzoly (F5).
6. Panel nástrojov Dokumenty
Konzoly chýbajú záložky. Jednoduchý a jednoduchý fakt. Rozšírenie Panel nástrojov Dokumenty pridáva túto funkciu. Všetky súbory, ktoré sa nachádzajú v sekcii 'aktívna' bočného panela, sa zobrazujú ako karty v tomto rozšírení. Môžete tiež skryť postranný panel a používať len panel s nástrojmi pre pekné rozhranie.
Ako použiť
Nainštalujte rozšírenie a opätovne natiahnite konzoly (F5).
7. Konzoly Git
Všetko sa v týchto dňoch pokúša integrovať s Gitomom; je to zďaleka najpopulárnejší verzia systému riadenia (VCS). Konzoly Git sú jednoducho najlepšie medzi podobnými rozšíreniami konzol. Má všetky funkcie git, ktoré budete potrebovať. Môžete ľahko vykonávať zmeny zo samotných zátvoriek, tlačiť a ťahať zmeny jedným kliknutím, prezerať históriu súborov a celkovú históriu pripomienok. Ak ste s Gitom dobrý, nenájdete žiadne problémy s týmto rozšírením.
Poznámka: Ak chcete používať konzolu Git, musíte mať v počítači nainštalovaný Git. Po inštalácii rozšírenia budete musieť zadať cestu k spustiteľnému súboru Git (ak nie je v predvolenej ceste).
Ako použiť
Používanie konzol Git je dosť priamočiaro. Vytvorte lokálny reposový priečinok Github zložku projektu v zátvorkách. Potom otvorte súbor, urobte nejaké zmeny a uložte ho. Potom môžete pokračovať a kliknúť na ikonu Git vpravo, čím sa otvorí podstavec Bracket Git. Uvádza zoznam všetkých úprav, ktoré ste vykonali vo svojich súboroch.
Skontrolujte všetky súbory, ktoré chcete prijať, a potom kliknite na tlačidlo Záväzok. Týmto sa otvoria vyskakovacie zoznamy vykonaných zmien. Zadajte svoju výzvu a kliknite na Ok. A úspešne ste spáchali súbor Git priamo zo zásuviek!
Po vykonaní jednoduchého kliknutia na tlačidlo (tiež zobrazuje počet nesynchronizovaných záväzkov, ako vidíte v GIF vyššie).
Konfigurácia nastavení
Otvorte panel Bracket Git a kliknite na tlačidlo Nastavenie (druhý vpravo). Nebojte sa nakonfigurovať zátvorky Git tak, ako sa vám páči.
Ak chcete zobraziť históriu súborov a pripomienok
Stačí kliknúť na príslušné tlačidlá a zobraziť históriu súborov a históriu záväzkov. Spomenulo sa, že môžete zmeniť avatar na čiernobiely avatar, farebný avatar alebo váš Gravatar?
8. Lint ALL Things
Lint VŠETKY veci. Všetko. Toto rozšírenie pokrýva všetky súbory naraz. Veľmi užitočné, keď máte veľký projekt s množstvom pripojených súborov. Všetky chyby vlákien sa zobrazujú pekne v tabuľke.
Ako použiť
Ak chcete použiť Lint ALL Things, stačí prejsť na kartu View a kliknúť na Lint Whole Project .
9. Konzoly Todo
Konzoly Todo je úhľadné malé rozšírenie, ktoré zobrazuje všetky komentáre TODO v úzkom zozname. Štandardne podporuje 5 značiek - TODO, NOTE, FIXME, CHANGES a FUTURE. Poznámky môžete označiť aj ako Hotovo. V možnostiach zobrazenia môžete filtrovať komentáre podľa značiek. Konzoly Todo vám umožňujú definovať vlastné farby pre značky, rovnako ako vlastné značky, v prípade, že by ste niekedy chceli byť kreatívni s vašimi komentármi.
Ak pracujete na veľkom projekte a potrebujete sledovať pripomienky z viacerých súborov, môžete zmeniť rozsah vyhľadávania Todo Brackets. Chcete vylúčiť niektoré súbory a priečinky ako priečinky dodávateľov? Žiaden strach. Stačí pridať cestu do zoznamu vylúčení. Môžete prispôsobiť nastavenia pre každý projekt pridaním súboru .todo do hlavného adresára projektu.
Môžete prechádzať všetky možnosti nastavení v dokumentácii github.
Ako použiť
Ak chcete používať zátvorky Todo, stačí pridať komentár ku kódu pomocou značky vnútri. Názov značky musí byť veľké, za ním nasleduje dvojbodka (:). Ak chcete zobraziť všetky súbory Todo, stačí kliknúť na ikonu Todo v pravom predĺžení.
Konfigurácia:
- Ak chcete povoliť poznámky pre poznámky HTML: Stačí otvoriť nastavenia - kliknite na ikonu Todo → Nastavenia (ikona ozubeného kolieska) - a kliknutím otvoríte súbor .todo. Do tohto súboru pridajte tento kód:
{"regex": {"predpona": "(? :)"}}
- Ak chcete zmeniť rozsah vyhľadávania: Pridajte tento kód do súboru .todo:
{"search": {"scope": "môj projekt"}} - Ak chcete vylúčiť akýkoľvek súbor / priečinok / príponu súboru z rozsahu vyhľadávania: Pridajte tento kód do súboru .todo:
{"search": {"scope": "môj projekt","ExcludeFolders": ["yourfolder"]
"excludeFiles": ["váš súbor"] "excludeFiles": [".yourextension"]]}
10. Skrášliť
Skrášľuje váš kód vyzerá dobre. Opravuje medzery, odsadenie a čiary.
Ako použiť
Je veľmi jednoduché používať Beautify. Jediné, čo musíte urobiť, je vybrať nejaký kód> Pravé kliknutie > Skrášlenie .
Prípadne môžete prejsť na kartu Upraviť a kliknúť na " Skráštiť ".
