Není to náhoda Atom, editor zdrojových kódů vytvořený Githubem je populární v komunitě pro vývoj webových aplikací. Není to jen snadno rozšiřitelné s tisíci balíčků Atom, a má široká jazyková podpora, ale téměř každá jeho část je přizpůsobitelné uživatele.
Využitím Atomu Funkce výstřižků, můžete zefektivnit své pracovní postupy kódování opakované opakování kódu můžete snížit opakující se část své práce. V tomto příspěvku vám ukážu, jak můžete použití vestavěných útržků kódu Atom, a vytvořte si vlastní úryvky.
Použijte vestavěné fragmenty kódu
Ve výchozím nastavení přichází Atom vestavěné úryvky kódu, každý z nich je vázány na rozsah patří do určitého typu souboru. Například, pokud pracujete na souboru s .js Pro tento soubor budou k dispozici pouze úryvky spadající do rozsahu JavaScriptu.
Vidět všechny dostupné úryvky pro aktuální typ souboru stiskněte Alt + Shift + S. Pokud vyberete úryvek z rozevíracího seznamu a kliknete na něj, Atom vloží celý úryvek do editoru bez dalších potíží.
Pokud jste si již vědomi možností, nemusíte nutně načíst celý seznam. Když začnete psát, Atom se objeví okno s výsledky automatického doplňování nahoru, který obsahuje dostupné úryvky kódu patřící do určitého rozsahu a řetězec, který jste dosud zadali.
Například pokud zadáte h znak do .html soubor, rozevírací seznam se všemi vestavěnými fragmenty HTML začínajícími na h objeví se.
Kliknutím na libovolnou možnost bude Atom vložte celou značku HTML (např. ), a umístěte kurzor do počáteční a zavírací značky.
Pokud nechcete obtěžovat rozevírací seznam, můžete dosáhnout stejného výsledku zadáním h1, a stisknutí klávesy Tab nebo Enter - obě tyto klávesy vložte celý fragment kódu patřící k předponě fragmentu.
Přidání vlastních fragmentů kódu
1. Najděte konfigurační soubor
Chcete-li přidat svůj vlastní fragment kódu do Atomu, musíte nejprve najít zavolá konfigurační soubor snippets.cson to je Notace objektu CoffeeScript soubor.
Klikněte na tlačítko Soubor> Úryvky… v horní liště a Atom otevře snippets.cson můžete přidat vlastní úryvky.
2. Najděte správný rozsah
Budete potřebovat čtyři věci Chcete-li přidat vlastní fragment:
název oblasti působnosti
název útržku
předpona který bude fungovat jako úchyt fragmentu
tělo útržku
Jméno, předpona a tělo úryvku (2-4) závisí pouze na vás, ale musíte najít název oboru (1) před přidáním vlastních fragmentů.
Chcete-li najít rozsah, který potřebujete, klepněte na tlačítko Soubor> Nastavení v horním menu, pak najděte Balíčky mezi Nastaveními. Zde spusťte vyhledávání rozsahu, který potřebujete, například pokud chcete přidat fragmenty kódu do jazyka HTML, zadejte HTML do vyhledávacího panelu.
Klikněte na tlačítko balíček jazykové podpory zvoleného jazyka a otevřete vlastní nastavení. Mezi Nastavení gramatiky, můžete rychle najít název oboru, jak vidíte na obrázku níže.
Zde je několik oborů, které budete chtít použít v projektech Atom:
Prostý text: .text.plain
HTML: .text.html.basic
CSS: .source.css
Sass: .source.sass
MÉNĚ: .source.css.less
JavaScript: .source.js
PHP: .text.html.php
Krajta: .source.python
Jáva: .source.java
Nezapomeňte, že budete muset přidat tečku (.) před názvem oblasti působnosti pro jeho použití v snippets.cson soubor.
3. Vytvořte jednorázové úryvky kódu
Vytvoření jeden řádek kódu, je třeba přidat rozsah, jméno, předponu a tělo fragmentu snippets.cson pomocí následující syntaxe:
'.text.html.basic': 'Widget Title': 'prefix': 'wti' body ':'"
Tento příklad fragmentu přidá a značka s widget-title třídy do rozsahu HTML. Do editoru Atom můžete podle této syntaxe přidat libovolný jiný útržek jednoho řádku.
Po uložení konfiguračního souboru, kdykoliv zadejte předponu a stiskněte klávesu Tab, Atom vloží příslušné útržkovité tělo do editoru kódu. Název fragmentu (v příkladu Název widgetu) se zobrazí v poli výsledků automatického doplňování.
4. Vytvořte úryvky víceřádkového kódu
Multi-line kódové úryvky použít trochu jinou syntaxi. Je třeba přidat stejná data jako u jednobarevných úryvků - rozsah, název, předponu a tělo fragmentu..
Jinak je zde to, že musíte umístit útržkovité tělo ve dvojici "" " (tři dvojité uvozovky).
Dále můžete usnadnit používání vlastních fragmentů kódu přidáním zastaví na útržkovité tělo. Zastavení tabulátoru označuje místa, kde se uživatel může pohybovat pomocí klávesy Tab. Při zastavení karty můžete ušetřit čas, který vyžaduje navigace v textu.
Můžete přidat zarážky karet za použití $ 1, $ 2, $ 3,… syntax. Atom umístí kurzor na místo, které najde $ 1, pak můžete skočit na $ 2 klávesou Tab a poté $ 3, a tak dále.
Atom vám to dovolí přidejte další informace pomocí útržků volitelné parametry. Tato funkce může být užitečná v případě, že váš editor používá i někdo jiný, a chcete, aby se dozvěděli o účelu útržku, nebo pokud máte tak složité vlastní úryvky, které k nim potřebujete přidat poznámky..
Hodnoty volitelných parametrů jsou zobrazeny v poli výsledků automatického doplňování , které se objeví, když začnete psát prefix. V níže uvedeném příkladu jsem přidal popis & a Více… odkaz na předchozí Název widgetu vlastní fragment:
'.text.html.basic': 'Widget Title': 'prefix': 'wti' body ':'"description": 'Název widgetu s tímto úryvkem můžete přidat do widgetu sidebar. "descriptionMoreURL":' http://hongkiat.com '
Když uživatel začne zadávat prefix wti, další informace (popis + odkaz) se zobrazí v dolní části pole výsledků automatického doplňování. Podívejte se na další volitelné parametry můžete přidat další informace do vlastních úryvků.
