Koduleht » Kodeerimine » Kuidas lisada kohandatud koodi väljavõtteid Atomile
Kuidas lisada kohandatud koodi väljavõtteid Atomile
See ei ole juhus, et Atom, Githubi loodud lähtekoodi toimetaja on veebiarenduse kogukonnas populaarne. See pole ainult kergesti laiendatav tuhandete Atomi pakettidega ja sellel on a lai keele tugi, kuid peaaegu iga osa on kohandatav kasutaja poolt.
Võimendades Atomi Lõigete funktsioon, saate muuta oma kodeerimise töövoo tootlikumaks korduvate koodilõikude korduvkasutamine saate vähendada oma töö korduvat osa. Selles postituses näitan teile, kuidas saate kasutage Atomi sisseehitatud koodilõiget, ja luua oma kohandatud skriptid.
Kasutage sisseehitatud koodipilte
Vaikimisi kaasas Atom sisseehitatud koodilõigud, millest igaüks on reguleerimisala kuulub teatud failitüübile. Näiteks, kui töötate failiga .js laiendiga on selle faili jaoks saadaval ainult JavaScripti ulatusega katkendid.
Et näha kõik saadaval olevad fragmendid Teie praeguse failitüübi puhul vajutage Alt + Shift + S. Kui valite rippmenüüst väljavõtte ja klõpsate seda, lisab Atom kogu väljavõtte oma redaktorisse ilma täiendava probleemideta.
Kui teil on võimalusi juba teadlik, ei pea te tingimata kogu loendit laadima. Kui hakkate kirjutama, ilmub Atom automaatse täitmise tulemused üles, mis sisaldab teatud ulatuse juurde kuuluvaid olemasolevaid koodilõikeid ja seni sisestatud stringit.
Näiteks kui sisestate h iseloomu a .html fail, rippmenüü koos kõigi sisseehitatud HTML-fragmentidega, mis algavad h ilmub.
Klõpsates suvalisel valikul Atom kleepige kogu HTML-silt (nt. ) ja paigutage kursor algus- ja lõppmärgise alla.
Kui te ei soovi rippmenüüst häirida, saate sama tulemuse sisestada h1, ja tabas Tab või Enter - mõlemad võtmed sisestage täielik koodilõik kuulub fragmendi prefiksile.
Kohandatud koodilõigete lisamine
1. Leidke konfiguratsioonifail
Oma kohandatud koodilõigete lisamiseks Atomile tuleb kõigepealt leida konfiguratsioonifaili snippets.cson see on a CoffeeScript objekti märkus faili.
Klõpsake Fail> Lõigud… ülemine riba menüü ja Atom avab snippets.cson faili, millele saate lisada oma kohandatud kärpeid.
2. Leidke õige ulatus
Sa vajad neli asja selleks, et lisada oma kohandatud fragment:
The ulatuse nimetus
The väljavõtte nimi
The eesliide see toimib väljavõtte käepidemena
The väljavõte
Nimi, eesliide ja fragmendi keha (2-4) sõltuvad ainult sinust, aga peate leidke ulatuse nimi (1) enne kohandatud fragmentide lisamist.
Vajaliku ulatuse leidmiseks klõpsake Fail> Seaded menüüriba menüü, seejärel leidke Paketid vahekaardil Seaded. Siin saate otsida vajalikku ulatust, näiteks kui soovid HTML-keeles sisestada koodilõigud, tüüp HTML otsinguribale.
Klõpsake keele tugipakett ja valige oma seaded. Hulgas Grammatika seaded, saate kiiresti määratleda ulatuse nime, nagu näete allpool oleval pildil.
Järgnevalt mõned võimalused, mida soovite Atom projektides kasutada:
Lihttekst: .text.plain
HTML: .text.html.basic
CSS: .source.css
Sass: .source.sass
LESS: .source.css.less
JavaScript: .source.js
PHP: .text.html.php
Python: .source.python
Java: .source.java
Ära unusta, et peate seda tegema lisada punkt (.) ulatuse nime ees selleks, et seda kasutada snippets.cson faili.
3. Loo ühe rea koodilõigud
Et luua a ühe rea koodi kood, peate lisama skripti ulatuse, nime, eesliite ja osa snippets.cson fail, kasutades järgmist süntaksit:
'.text.html.basic': 'vidina pealkiri': 'eesliide': 'wti' body ':''
See näide fragment sisaldab a sildiga vidina pealkiri klassi HTML-i ulatusele. Selle süntaksiga saate oma Atomi redaktorisse lisada mis tahes muu ühe rea koodi koodi.
Kui olete konfigureerimisfaili salvestanud, siis alati tippige eesliide & tab Tab, Atom kleepib kuuluva fragmendi keha oma koodiredaktorisse. Väljavõtte nimi (näites) Vidina pealkiri) kuvatakse automaatse täitmise tulemuste kastis.
4. Loo mitmerealised koodilõigud
Mitmerealised koodilõigud kasutage veidi erinevat süntaksit. Peate lisama samad andmed kui ühe rea joonestike jaoks - ulatuse, nime, eesliite ja väljavõtte keha..
Siinkohal on teistsugune, et peate fragmenti kere asetama sees paari "" " (kolm kahekordset hinnapakkumist).
'.text.html.basic': '' Image Link '': 'eesliide': 'iml' body ': "" " "" "
Kui soovite lisada rohkem kui üks kohandatud skripte sama ulatusega, lisage ulatuse nimi ainult üks kord, seejärel loetlege fragmendid ükshaaval:
Saate oma kohandatud koodilõikude kasutamist veelgi lihtsustada, lisades vahekaart peatub lõikepunkti. Vahekaardipeatused näitavad täpid, kus kasutaja saab Tab klahvi abil navigeerida. Vahekaardipeatustega saate salvestada teksti sisestamise aja.
Saate lisada vahelehti kasutades $ 1, $ 2, $ 3,… süntaks. Atom asetab kursori kohale, mille ta leiab $ 1, siis saate hüpata $ 2 seejärel klahviga Tab $ 3, ja nii edasi.
'.text.html.basic': '' Image Link '': 'eesliide': 'iml' body ': "" " "" "
6. Lisage valikulised parameetrid
Atom võimaldab teil lisage lisateavet oma fragmentidele, kasutades valikulised parameetrid. See funktsioon võib olla kasulik, kui keegi teine kasutab ka teie toimetajat ja soovite lasta neil teada väljavõtte otstarbest või kui teil on nii keerulisi kohandatud fragmente, mida peate neile lisama..
Valikuliste parameetrite väärtused on kuvatakse automaatse täitmise tulemuste kastis see ilmub, kui hakkate eesliite sisestama. Alltoodud näites lisasin kirjelduse & a Veel… link eelmisele Vidina pealkiri kohandatud fragment:
'.text.html.basic': 'vidina pealkiri': 'eesliide': 'wti' body ':'"kirjeldus": "Saate lisada selle väljavõtte vidina pealkirja külgriba vidinale." descriptionMoreURL ": 'http://hongkiat.com'
Kui kasutaja alustab eesliite kirjutamist wti, lisateave (kirjeldus + link) kuvatakse automaatse täitmise tulemuste kasti allosas. Vaadake muud valikulised parameetrid saate lisada oma kohandatud fragmentidele lisateavet.
