Text sublim 2 Primii pași

În mai puțin de un an, editorul de cod Sublime Text 2 - disponibil pentru Mac, Windows și Linux - a crescut foarte repede să devină editorul ales pentru un număr mare de dezvoltatori. Cum se face? Ei bine, este un editor sofisticat, cu viteza de fulger, o comunitate incredibil de vibranta a plugin-urilor, configurare usoara, modul Vintage (Vim), mai multe cursoare - lista continua.

Dacă nu ați făcut încă comutatorul, din vreun sentiment de loialitate față de editorul dvs. curent, alegeți-mi douăzeci de minute și vă voi convinge!

Rețineți că acest articol, pentru convenienccsse și lizibilitatea, va utiliza exclusiv legăturile de tastatură specifice Mac. Consultați aici versiunile echivalente Windows / Linux.


1 - Cursoare multiplă

Să începem cu caracteristica care vă va lovi cu gura: mai multe cursoare. O notă de precauție: odată ce experimentați flexibilitatea de a avea mai mulți cursori la vârful degetelor, nu veți putea reveni la vechiul mod.

Imaginați-vă că trebuie să schimbați fiecare apariție a cuvântului, mymethod, la newMethod. În mod tradițional, puteți efectua o căutare și înlocui; cu toate acestea, în Sublime, este mult mai ușor. Pur și simplu plasați cursorul în interiorul cuvântului și tastați Control + comandă + g. Cu această apăsare de taste singur, ați selectat acum fiecare apariție mymethod, și aveți cursoare multiple la vârful degetelor. Modificați textul și vizionați-i pe toți actualizați! Claxonul coborând, bine?

Alternativ, puteți apăsa Comanda + d în mod repetat, pentru a selecta treptat fiecare apariție suplimentară a cuvântului.


2 - Paleta de comandă

Sublime paleta de comandă este un Dumnezeu-trimite pentru cei care preferă să atingă mouse-ul cât mai puțin posibil (mai mult pe faptul că în curând). Această paletă vă permite să executați nenumărate comenzi, cum ar fi schimbarea tipului de sintaxă pentru documentul curent, instalarea pluginurilor și căutarea fragmentelor, pentru a numi câteva.

Pentru a schimba, de exemplu, sintaxa curentă evidențiată pentru documentul curent de la, de exemplu, HTML, la CSS, apăsați Comandă + Shift + p, și tastați "css". Opțiunea "Setați sintaxa: CSS" ar trebui afișată acum. Hit enter, și ați terminat! Rețineți că puteți profita de căutarea fuzzy aici; ca atare, nu trebuie să tastați întregul cuvânt.

Memorați această comandă de la tastatură și folosiți-o frecvent.


3 - Controlul pachetelor

Creat de Will Bond, Controlul pachetelor este un manager de pachete puternic care vă permite să instalați, direct din editorul de coduri, orice pachet (sau plugin) pe care îl puteți imagina. Aveți nevoie de codificare Zen? Instalați-l în trei secunde. Ce este despre suportul Prefixr sau evidențierea sintaxei CoffeeScript? Este nevoie de doar câteva setări ale tastaturii pentru configurare. Nu mai spălați webul pentru plugin-ul potrivit și apoi cercetați unde să îl instalați.

Pentru a instala Controlul pachetelor, vizitați site-ul Will Bond, copiați fragmentul de cod furnizat, reveniți la Sublime Text, apăsați Control +', și lipiți fragmentul și reporniți-l. Ați terminat!

Să instalăm Zen Coding. Deschideți paleta de comandă (Comandă + Shift + p) și de tipul, "install." Odată ce apăsați introduce, Sublime va furniza o listă a tuturor pluginurilor diferite disponibile pentru a fi instalate. Caută Zen pentru a aduce "Zen Coding", și a lovit introduce pentru ao instala. Da - e atât de ușor! Pentru a confirma că a funcționat, într-un fișier HTML gol, tastați ul> li * 4 + Tab. Tada!


4 - Teme TextMate

Este probabil ca cititorii de Mac să utilizeze în prezent TextMate. Din fericire, Sublime Text oferă suport complet pentru temele TextMate. Aceasta înseamnă că, da, schema dvs. de culori personalizată poate fi migrată peste text sublim, fără o uncie de configurație. Pur și simplu puneți-o în directorul "Pachete" așa cum este.


5 - Nettuts + Fetch

De câte ori ați descărcat manual, de exemplu, Bootplate HTML5 sau biblioteca jQuery? Asta e risipitor; nu ar fi mai ușor să putem rula o scurtă apăsare de tastă și să le descărcăm instantaneu în proiectul curent? Desigur, ar fi! Nettuts + Fetch este soluția.

Instalați-l prin Controlul pachetelor, apoi căutați "Fetch: Gestionați fișierele la distanță". Aceasta va afișa două obiecte pentru a prelua fișiere și pachete individuale, respectiv; două au fost oferite pentru tine.

Pentru a le testa, creați un fișier nou, căutați "Fetch" în paleta de comenzi, alegeți "Fișier unic -> jQuery" și urmăriți ultima versiune a bibliotecii. Apoi, încercați să instalați un întreg pachet și să fiți uimiți.


6 - Du-te la simbol

Vizitați orice clasă sau listă de funcții pe care le aveți la dispoziție, tastați Comandă + r, și veți primi o listă cu toate simbolurile de pe pagină. Observați cum folosim @ pentru a vedea metodele.

De exemplu, dacă vizionați o clasă PHP, Comandă + r va lista toate numele de metode. Apoi puteți utiliza căutarea fuzzy pentru a trece imediat la metoda dorită.

Când combinăm acest lucru cu capabilitățile de schimbare instantă a fișierelor de la Sublime, această comandă devine extrem de utilă. Imaginați-vă că trebuie să editați style.css, și, în special, .cutie clasa din dosar; tip Comandă + p, Stilul @ caseta, și tu ești acolo!


7 - Prefixr

Prefixr este un serviciu web care aplică automat prefixele furnizorilor CSS în foile dvs. de stil, astfel încât să nu trebuie să vă amintiți ce furnizori să utilizeze pentru o proprietate CSS3 dată. Pluginul Prefixr aduce această funcție direct editorului!

După ce instalați plugin-ul prin Controlul pachetelor, selectați conținutul foii de stil și activați pluginul introducând Control + comandă + x. Voila! Fișierul dvs. a fost actualizat instantaneu. Utilizați sintaxa oficială și lăsați Prefixr să înțeleagă cerințele specifice furnizorului.


8 - Fișier nou avansat

Cu cât atingeți mai puțin mouse-ul, cu atât mai bine. Din păcate, în mod implicit, crearea unui fișier nou în Text Sublime poate dura mai mult decât ne-ar plăcea. Pluginul "Advanced New File", care, ca întotdeauna, poate fi instalat prin Controlul pachetelor, remediază acest lucru.

După instalare, tastați Comandă + Opțiune + n, și veți vedea un nou panou afișat în partea de jos.

Ce este fantastic în legătură cu acest plugin este că puteți crea fișiere în dosare care nu există încă. Poate că trebuie să creați un nou scripts.js fișier, dar nu ați creat încă js director. Este în regulă; pluginul va ști să creeze dosarul dacă acesta nu există încă. Pur și simplu tastați calea completă la fișierul dorit nou și sunteți bine să mergeți.

Să creăm un nou fișier jQuery.js într-un js / libs director care nu a fost încă creat; Opțiune + Comandă + n, js / libs / jquery.js, Salvați, Comandă + Shift + p, "Fetch", "Fișier unic", "jQuery". Acum, în câteva secunde, am creat un arbore de directoare și am descărcat ultima versiune a bibliotecii.


9 - Vintage Mode

În cazul în care doresc să facă acest lucru, utilizatorii Vim pot migra cu ușurință în textul Sublime, datorită modului Vintage opțional. Pentru ao activa, editați fișierul "Preferințe prestabilite" din meniul Preferințe, defilați la partea de jos și eliminați articolul "Vintage" din ignored_packages mulțime.

Acum, apăsați Evadare, și sunteți în modul de comandă! Vei observa că legăturile cheie ale lui Sublime sunt destul de exacte!


10 - Fragmente native

Fiecare fragment din textul Sublime se referă la un singur fișier și permite completarea filelor și valorile implicite. Pentru a crea un fragment nou, alegeți "Instrumente -> Snippet nou". În acest fișier nou, puteți, în cadrul etichetă, introduceți fragmentul. Aveți, de asemenea, posibilitatea de a selecta un declanșator de tab și un domeniu de aplicare, care să asigure că fragmentul este accesibil numai dintr-un anumit tip de fișier.

Salvați fișierul cu a .sublimă-fragment extensie, și testați-l!


11 - Fragmente versiuni

În timp ce fragmentele native ale Sublime se ocupă cu siguranța, pentru fragmente mai mari, prefer să profite de GitHub Gists și controlul versiunii.

Începeți prin instalarea pluginului "Gist" prin Controlul pachetelor. Acest lucru ne va da acum o multime de noi optiuni in paleta de comenzi.

Când încercați să creați un nou Gist, veți descoperi că mai întâi trebuie să furnizați pluginul cu acreditările dvs. GitHub. Vă recomandăm să creați un cont special special pentru fragmente. Odată ce ați făcut acest lucru, setați acreditările și încercați din nou. Odată ce ați creat o mână de fragmente, puteți să le listați prin paleta de comandă, selectând "Gist: Open Gist".

Cea mai bună parte este că, atunci când introduceți fragmente existente pe gist.github.com, acestea vor fi automat disponibile pentru dvs. în textul Sublime - plus, control gratuit al versiunilor pentru fragmente!


12 - Construiți sisteme

Sistemul de construire a lui Sublime ne permite să aplicăm legăturile cheie, care pot fi transmise prin programe externe, cum ar fi CoffeeScript, Sass, Grunt și multe altele. Aceasta înseamnă că, mai degrabă decât trecerea la Terminal pentru a rula comanda dvs. de construire, puteți realiza același lucru direct din editor.

Să folosim CoffeeScript ca un exemplu, deoarece este destul de popular în aceste zile. Începeți prin a crea un coffeescript.sublime-build fișier în directorul "Pachete /". Apoi, inserați următorul cod în:

"cmd": ["cafea", "- c", "$ file"], "selector": "source.coffee", "path": "/ usr / local / bin /

Deși există mai multe opțiuni disponibile pentru noi, vom rămâne cu aceste trei pentru acum. cmd specifică comanda care ar trebui executată, împreună cu orice argumente și steaguri. În acest caz, executăm fișierul curent prin comanda compilării CoffeeScript. În al doilea rând, cale este necesar doar dacă CoffeeScript nu este instalat în calea de bază.

Odată ce ați salvat fișierul, un nou opțional va fi disponibil prin "Instrumente -> Construiți sistemul". Alegeți "CoffeeScript" și, acum, când executați comanda "build" cu Comandă + b, actualul fișier CoffeeScript va fi compilat!

Addy Osmani are un articol fantastic despre capabilitățile de construire a Sublimului Text.


13 - Editarea gratuită a distragerii

Uneori, trebuie să eliminăm tot puful suplimentar care ne împiedică codarea. Utilizați "Free Distraction Mode" pentru a șterge ecranul, cu excepția codului. Această opțiune este disponibilă, prin meniul Vizualizare. Selectați "Enter Free Mode Distraction"; sau utilizați comanda rapidă de la tastatură Mac, Control + Shift + Comandă + F.


14 - O vedere de păsări

Una dintre trăsăturile de stand-out ale lui Sublime este bara laterală unică, care oferă o vizualizare a păsărilor pentru fișierul curent. Acest lucru poate fi extrem de util pentru fișierele mari, deoarece ne permite să scanăm un fișier în câteva secunde, fără a trebui să defilați manual pagina.


15 - Coloane multiple

Preferați să editați mai multe fișiere în aceeași fereastră? Sublime oferă o mulțime de vederi împărțite, inclusiv rânduri și coloane. Căutați Vizualizare -> Aspect pentru a vedea opțiunile disponibile și asigurați-vă că memorați comenzile de pe tastatură, deoarece veți folosi adesea această funcție!


16 - Colorarea live CSS

Pluginul "Live CSS" este simplu, dar util. Acesta va seta automat fundalul oricărei valori de culoare în foaia dvs. de stil egală cu cea pe care ați specificat-o. Desigur, este o mică comoditate, dar, totuși, poate fi utilă!


17 - Reprezentanți

În timpul dezvoltării, de multe ori, nu avem încă conținutul final pentru o aplicație web. În aceste cazuri, de obicei, folosim text și imagini cu substituent. Când ne gândim cât de des se face acest lucru, nu ar fi inteligent să creeze o mână de fragmente de destinații de înlocuire? Ei bine, plugin-ul placeholder face acest lucru foarte!

Indiferent dacă aveți nevoie de o imagine temporară, câteva paragrafe "lorem ipsum" sau chiar o listă de definiții cu text fictiv, acest plugin va fi perfect pentru lucrare.


18 - Ghiduri de indentare

O comoditate surprinzător de rară, găsită în Notepad ++, este ghidajele de indentare. Uneori, când răsfoiți fișiere masive, poate fi dificil să se potrivească indentarea fără un pic de ajutor.

Sublime ghiduri indentation oferi vizuale punctate utile pentru a rezolva acest lucru.


19 - Configurare ușoară

Sublime Text este uneori criticat pentru că nu oferă o interfață flashy pentru setarea opțiunilor de configurare. În mod ironic, în opinia acestui autor, faptul că Sublime afișează literalmente un obiect JavaScript modificabil este unul dintre cele mai mari avantaje ale acestuia. Acest lucru face ca procesul de ajustare a setărilor Sublime exact la nevoile dvs. la fel de simplu ca uman posibil.

De exemplu, pentru a dezactiva "Indent Guidelines", deschideți fișierul de setări "Default", căutați draw_indent_guides (cu Comandă + i) și setați valoarea la fals. Uşor! Asigurați-vă că examinați toate setările disponibile.


20 - Comutarea fișierelor în milisecunde

Dacă încă vă referiți manual la bara laterală pentru a găsi fișierul dorit pentru a comuta, faceți acest lucru greșit. Schimbarea instantă a fișierelor de la Sublime este incredibilă și este mai rapidă decât ați experimentat vreodată într-un editor.

Tip Comandă + p pentru a afișa o listă a tuturor fișierelor din proiectul curent. Acum puteți utiliza căutarea fuzzy pentru a alege fișierul la care doriți să comutați. Aveți nevoie de o listă a tuturor fișierelor JavaScript? Tip .js. Veți observa că, pe măsură ce tastați căutarea, textul Sublime va trece cu viteza fulgerului la fișierul de vârf care se potrivește cu interogarea dvs. de căutare.

Aceasta este metoda preferată pentru navigarea la fișiere noi. Bara laterală este o ultimă soluție.


21 - Legarea cheilor

Sublime ne dă posibilitatea de a seta cu ușurință legăturile cheie pentru a declanșa orice comandă. În timp ce o mulțime de legături sunt deja construite, dacă doriți, le puteți modifica la nevoile dvs..

Luați în considerare legarea pentru mutarea unui fișier într-o altă fereastră, atunci când lucrați cu mai multe coloane. În mod implicit, trebuie să apăsăm Control + Shift + 2; totuși, acest lucru poate fi puțin greu de reținut. Să facem asta în schimb Opțiunea + 2.

În timp ce am putea edita fișierul implicit de chei, aceasta este o practică proastă, datorită faptului că orice actualizare sublimă va reseta personalizările. În schimb, este mai bine să editați fișierul Legături cheie de utilizator.

"tastele": ["alt + 1"], "comanda": "move_to_group", "args": "group": 0, ":" move_to_group "," args ": " grup ": 1, " tastele ": [" alt + 3 "]: , "chei": ["alt + 4"], "comanda": "move_to_group", "args": "group": 3

Nu-ți face griji; dacă aceasta pare confuză, căutați fișierul implicit pentru chei pentru setările pe care trebuie să le modificați, apoi copiați-le și inserați-le în fișierul de chei pentru utilizatori și actualizați corespunzător "cheile".


22 - Căutarea live

Când trebuie să căutăm un fișier, adesea recurgem la aducerea unui panou "Căutați și înlocuiți", care necesită timp. În schimb, apăsați Comandă + i pentru a efectua o căutare live pe fișierul curent. Veți fi uimit de cât de rapidă este această metodă.


23 - Codul îndoit

Firește, textul Sublime oferă suport pentru plierea codurilor pe mai multe niveluri. Să presupunem că lucrați la o foaie de stil și doriți să ascundeți toate proprietățile; fie alegeți "Editare -> Pliere rece -> Pliere toate", sau apăsați Comanda + k + 1.

Frumos! Pentru a dezvălui toate blocurile, apăsați Comanda + k + j.

Legăturile de taste pot dura ceva timp pentru memorare, dar merită efortul.


24 - Versiune de dezvoltare

Nu uitați că textul Sublime 2 se dezvoltă activ. Vă încurajez să utilizați versiunea de dezvoltare disponibilă la sublimetext.com/dev. Nu-ți face griji; chiar dacă acestea sunt versiuni de dezvoltare, veți întâlni rar orice bug-uri.


25 - Aliniere instantanee

Alignment plugin-ul, de Will Bond, va ajusta instantaneu codul dvs. pentru a face mai frumos stabilit cod. În general, este folosit pentru a se asigura că semnul egal, =, pentru asignarea variabilelor.

Instalat prin controlul pachetelor, pluginul Aliniere poate fi activat prin selectarea unei bucăți de cod aplicabile și prin apăsarea tastei Control + Shift + a.

În mod efectiv, pluginul va traduce:

var prima = 'Joe'; var ultima = 'Negru'; var job_title = 'Moartea'; var status = 'În vacanță';

În:

var prima = 'Joe'; var ultima = 'Negru'; var job_title = 'Moartea'; var status = 'În vacanță';

Simplu, dar de ajutor!


Gânduri închise

În mod clar, există multe secrete și trucuri în textul Sublime 2, dar această listă vă va face să începeți! Dacă doriți să aflați mai multe despre acest editor fantastic, asigurați-vă că vă referiți la cursul următor: "Flux de lucru perfect în Text Sublim 2."

Cod