Share
In meno di un anno, l'editor di codice Sublime Text 2, disponibile per Mac, Windows e Linux, è salito alle stelle diventando l'editor preferito per un numero enorme di sviluppatori. Come mai? Beh, è un editor sofisticato, con velocità velocissima, una community di plugin incredibilmente vivace, configurazione semplice, modalità Vintage (Vim), cursori multipli - la lista continua.
Se non hai ancora fatto il cambio, per un senso di lealtà verso il tuo attuale redattore di scelta, dammi venti minuti e ti convincerò!
Si noti che questo articolo, per convenienccsse e leggibilità, utilizzerà esclusivamente i binding della tastiera specifici per Mac. Fare riferimento qui per le versioni equivalenti di Windows / Linux.
Iniziamo con la funzione che ti lascerà a bocca aperta: più cursori. Una nota di cautela: una volta sperimentata la flessibilità di avere più cursori a portata di mano, non sarai più in grado di tornare alla vecchia maniera.
Immagina di dover cambiare ogni occorrenza della parola, myMethod, a newMethod. Tradizionalmente, puoi eseguire una ricerca e sostituirla; tuttavia, in Sublime, è molto più facile. Basta posizionare il cursore all'interno della parola e digitare Controllo + Comando + g. Con questo tasto da solo, ora hai selezionato ogni occorrenza di myMethod, e avere più cursori a portata di mano. Cambia il testo e guarda tutti gli aggiornamenti! A bocca aperta, giusto?
In alternativa, puoi premere Comando + d ripetutamente per selezionare in modo incrementale ogni occorrenza aggiuntiva della parola.
La tavolozza dei comandi di Sublime è un messaggio inviato da Dio per coloro che preferiscono toccare il mouse il meno possibile (di più su questo a breve). Questa palette ti consente di eseguire innumerevoli comandi, come cambiare il tipo di sintassi per il documento corrente, installare plug-in e cercare snippet, per citarne alcuni.
Ad esempio, per cambiare l'evidenziazione della sintassi corrente per il documento corrente da, ad esempio, HTML, a CSS, premere Comando + Maiusc + p, e digitare "css". L'opzione "Imposta sintassi: CSS" dovrebbe ora essere visualizzata. Hit enter, e il gioco è fatto! Nota che puoi sfruttare la ricerca fuzzy qui; come tale, non è necessario digitare l'intera parola.
Memorizza questo comando da tastiera e usalo spesso.
Creato da Will Bond, Package Control è un potente gestore di pacchetti che ti permette, direttamente dall'editor di codice, di installare qualsiasi pacchetto (o plugin) che tu possa immaginare. Hai bisogno di Zen Coding? Installalo in tre secondi. Che dire del supporto Prefixr o dell'evidenziazione della sintassi CoffeeScript? Ci vogliono solo un paio di battute per l'impostazione. Non più perlustrando il web per il plug-in giusto, e poi cercando dove installarlo.
Per installare Package Control, visita il sito di Will Bond, copia lo snippet di codice fornito, torna a Sublime Text, premi Controllo +', e incolla lo snippet e si riavvia. Hai finito!
Cerchiamo di installare Zen Coding. Apri la palette dei comandi (Comando + Maiusc + p) e digita "installa". Una volta premuto accedere, Sublime fornirà un elenco di tutti i vari plug-in disponibili per l'installazione. Cercare zen per far apparire "Zen Coding" e colpire accedere per installarlo. Sì, è così facile! Per confermare che ha funzionato, in un file HTML vuoto, digitare ul> li * 4 + Tab. Tada!
È probabile che i lettori Mac stiano attualmente utilizzando TextMate. Fortunatamente, Sublime Text offre pieno supporto per i temi di TextMate. Ciò significa che, sì, la combinazione di colori personalizzata può essere migrata su Sublime Text senza un'oncia di configurazione. Inseriscilo semplicemente nella directory "Packages" così com'è.
Quante volte hai scaricato manualmente, ad esempio, HTML5 Boilerplate o la libreria jQuery? Questo è dispendioso; non sarebbe più facile se potessimo eseguire una rapida pressione di un tasto e scaricarli istantaneamente nel progetto corrente? Certo che lo farebbe! Nettuts + Fetch è la soluzione.
Installalo tramite Controllo pacchetti, quindi cerca "Recupera: Gestisci file remoti". Questo mostrerà due oggetti per il recupero di singoli file e pacchetti, rispettivamente; due sono stati forniti per te.
Per testarlo, crea un nuovo file, cerca "Fetch" nella palette dei comandi, scegli "Single File -> jQuery" e guarda immediatamente l'ultima versione della libreria. Quindi, prova a installare un intero pacchetto e sii stupito.
Visita qualsiasi classe o elenco di funzioni che hai a disposizione, scrivi Comando + r, e ti verrà presentato un elenco di tutti i simboli sulla pagina. Nota come usiamo il @ simbolo per visualizzare i metodi.
Ad esempio, se stai visualizzando una classe PHP, Comando + r elencherà tutti i nomi dei metodi. È quindi possibile utilizzare la ricerca fuzzy per passare immediatamente al metodo desiderato.
Quando combiniamo questo con le capacità di passaggio immediato dei file di Sublime, questo comando diventa particolarmente utile. Immagina di aver bisogno di modificare style.css, e, nello specifico, il .scatola classe all'interno di quel file; genere Comando + p, scatola @ stile, e tu sei lì!
Prefixr è un servizio Web che applica automaticamente i prefissi dei fornitori CSS necessari ai fogli di stile, in modo da non dover ricordare quali venditori utilizzare per una determinata proprietà CSS3. Il plugin Prefixr porta questa funzionalità direttamente al tuo editor!
Una volta installato il plug-in tramite Controllo pacchetto, seleziona il contenuto del tuo foglio di stile e attiva il plug-in digitandolo Controllo + Comando + x. Ecco! Il tuo file è stato immediatamente aggiornato. Usa la sintassi ufficiale e lascia che Prefixr comprenda i requisiti specifici del venditore.
Meno tocchi il mouse, meglio è. Sfortunatamente, per impostazione predefinita, la creazione di un nuovo file in Sublime Text può richiedere un po 'più tempo di quanto vorremmo. Il plug-in "Nuovo file avanzato", che può, come sempre, essere installato tramite Controllo pacchetti, risolve questo problema.
Una volta installato, digitare Comando + Opzione + n, e vedrai un nuovo pannello pop-up in basso.
La cosa fantastica di questo plugin è che puoi anche creare file all'interno di cartelle che non esistono ancora. Forse hai bisogno di creare un nuovo scripts.js file, ma non hai ancora creato il js directory. Va bene; il plugin saprà di creare la cartella se non esiste ancora. Basta digitare il percorso completo per il nuovo file desiderato, e sei a posto.
Creiamo un nuovo file jQuery.js all'interno di a JS / libs directory che deve ancora essere creata; Opzione + Comando + n, JS / libs / jquery.js, salvare, Comando + Maiusc + p, "Recupera", "File singolo", "jQuery". Ora, in pochi secondi, abbiamo creato un albero di directory e scaricato l'ultima versione della libreria.
Se desiderano farlo, gli utenti di Vim possono facilmente migrare a Sublime Text, grazie alla sua modalità Vintage opzionale. Per abilitarlo, modifica il file "Preferenze predefinite" nel menu Preferenze, scorri fino in fondo e rimuovi l'elemento "Vintage" dal ignored_packages schieramento.
Adesso, premi Fuga, e sei in modalità di comando! Scoprirai che i tasti di Vi di Sublime sono abbastanza precisi!
Ogni frammento in Sublime Text fa riferimento a un singolo file e consente il completamento della tabulazione e valori predefiniti. Per creare un nuovo snippet, seleziona "Strumenti -> Nuovo frammento". In questo nuovo file, puoi, all'interno di
Salva il file con a .sublime-frammento estensione, e testarlo!
Sebbene gli snippet nativi di Sublime svolgano certamente il lavoro, per i frammenti più grandi, preferisco sfruttare i GitHub Gists e il controllo della versione.
Inizia installando il plugin "Gist" tramite Package Control. Questo ora ci darà una manciata di nuove opzioni nella palette dei comandi.
Quando tenti di creare un nuovo Gist, scoprirai che devi prima fornire il plugin con le credenziali di GitHub. Ti consiglio di creare un account speciale specifico per i tuoi snippet. Dopo averlo fatto, imposta le credenziali e riprova. Dopo aver creato una manciata di frammenti, puoi elencarli attraverso la palette dei comandi, scegliendo "Gist: Open Gist."
La parte migliore è che, quando si biforca di frammenti esistenti attraverso gist.github.com, saranno automaticamente disponibili in Sublime Text, oltre al controllo della versione gratuito per i frammenti di codice!
Il sistema di compilazione di Sublime ci consente di applicare le combinazioni di tasti, che possono essere reindirizzate a programmi esterni, come CoffeeScript, Sass, Grunt e altro. Ciò significa che, anziché passare al terminale per eseguire il comando di build, è possibile eseguire la stessa operazione direttamente dall'editor.
Usiamo CoffeeScript come esempio, dato che è abbastanza popolare in questi giorni. Inizia creando un coffeescript.sublime-build file nella cartella "Pacchetti /". Successivamente, incolla il seguente codice in:
"cmd": ["coffee", "- c", "$ file"], "selettore": "source.coffee", "percorso": "/ usr / local / bin /"
Mentre ci sono più opzioni disponibili per noi, continueremo con questi tre per ora. cmd specifica il comando che deve essere eseguito, insieme a qualsiasi argomento e flag. In questo caso, stiamo eseguendo il file corrente tramite il comando compila CoffeeScript. in secondo luogo, sentiero è necessario solo se CoffeeScript non è installato nel tuo percorso di base.
Una volta salvato il file, sarà disponibile un nuovo optional tramite "Strumenti -> Sistema di creazione". Scegli "CoffeeScript" e, ora, quando esegui il comando "build" con Comando + b, il file CoffeeScript corrente verrà compilato!
Addy Osmani ha un fantastico articolo sulle funzionalità di build di Sublime Text.
A volte, abbiamo bisogno di filtrare tutti i lanci aggiuntivi che si intromettono nella nostra codifica. Usa "Distraction Free Mode" per cancellare lo schermo, ad eccezione del codice. Questa opzione è disponibile, tramite il menu Visualizza. Seleziona "Entra in modalità gratuita di distrazione" ?? o utilizzare la scorciatoia da tastiera Mac, Control + Maiusc + Comando + F.
Una delle caratteristiche distintive di Sublime è la sua barra laterale unica che offre una vista a volo d'uccello del file corrente. Questo può essere incredibilmente utile per file di grandi dimensioni, in quanto ci consente di scansionare un file in pochi secondi, senza dover manualmente scorrere la pagina.
Preferisci modificare più file all'interno della stessa finestra? Sublime offre una manciata di viste divise, incluse righe e colonne. Vai a Visualizza -> Layout per visualizzare le scelte disponibili ed essere sicuri di memorizzare i comandi della tastiera, poiché userete spesso questa funzione!
Il plugin "Live CSS" è semplice, ma utile. Imposta automaticamente lo sfondo di qualsiasi valore di colore nel tuo foglio di stile uguale a quello che hai specificato. Certamente, è una piccola comodità, ma, nondimeno, può essere utile!
Durante lo sviluppo, molte volte, non disponiamo ancora del contenuto finale per un'applicazione web. In questi casi, in genere utilizziamo testo e immagini segnaposto. Considerando la frequenza con cui lo facciamo, non sarebbe intelligente creare una manciata di frammenti di segnaposto? Bene, il plugin segnaposto fa proprio questo!
Se hai bisogno di un'immagine temporanea, alcuni paragrafi "lorem ipsum" o anche una lista di definizioni con un testo fittizio, questo plugin sarà perfetto per il lavoro.
Una convenienza sorprendentemente rara, che si trova in Notepad ++, è una guida all'indentazione. A volte, sfogliando file di grandi dimensioni, può essere difficile abbinare il rientro senza un po 'di aiuto.
Le guide di indentazione di Sublime forniscono utili immagini tratteggiate per risolvere questo problema.
Il testo sublime a volte è criticato perché non offre un'interfaccia appariscente per l'impostazione delle opzioni di configurazione. Ironicamente, secondo l'autore, il fatto che Sublime mostri letteralmente un oggetto JavaScript modificabile è uno dei suoi punti di forza. Questo rende il processo di modifica delle impostazioni di Sublime esattamente alle tue esigenze nel modo più semplice e umano possibile.
Ad esempio, per disabilitare "Linee guida di rientro", aprire il file di impostazioni "Predefinito", cercare draw_indent_guides (con Comando + i), e impostare il suo valore su falso. Facile! Assicurati di rivedere tutte le impostazioni disponibili.
Se stai ancora facendo riferimento manualmente alla barra laterale per trovare il file desiderato da passare, stai sbagliando. Il passaggio immediato ai file di Sublime è incredibile ed è più veloce di quanto tu abbia mai sperimentato in un editor.
genere Comando + p per visualizzare un elenco di tutti i file nel progetto corrente. È ora possibile utilizzare la ricerca fuzzy per scegliere il file che si desidera passare. Hai bisogno di un elenco di tutti i file JavaScript? genere .js. Scoprirai che, mentre digiti la ricerca, Sublime Text, con la velocità della luce, passerà al file più in alto che corrisponde alla tua query di ricerca.
Questo è il metodo preferito per navigare verso nuovi file. La barra laterale è l'ultima risorsa.
Sublime ci dà la possibilità di impostare facilmente associazioni di tasti per attivare qualsiasi comando. Mentre una grande quantità di associazioni sono già integrate, se lo desideri, puoi modificarle in base alle tue esigenze.
Considerare il legame per lo spostamento di un file in una finestra diversa, quando si lavora con più colonne. Per impostazione predefinita, dovremmo premere CTRL + MAIUSC + 2; tuttavia, questo può essere un po 'difficile da ricordare. Facciamo invece rimappare questo a Opzione + 2.
Mentre potremmo modificare il file di associazioni di tasti predefinito, questa è una cattiva pratica, poiché qualsiasi aggiornamento di Sublime ripristinerà le tue personalizzazioni. Al contrario, è meglio modificare il file dei binding chiave utente.
["keys": ["alt + 1"], "command": "move_to_group", "args": "group": 0, "keys": ["alt + 2"], "comando ":" move_to_group "," args ": " group ": 1, " keys ": [" alt + 3 "]," command ":" move_to_group "," args ": " group ": 2 , "keys": ["alt + 4"], "command": "move_to_group", "args": "group": 3]
Non preoccuparti; se questo sembra confuso, cerca il file di associazioni di tasti predefinito per le impostazioni che devi modificare, quindi copialo e incollalo nel file dei tasti di scelta dell'utente, e aggiorna le "chiavi" di conseguenza.
Quando abbiamo bisogno di cercare un file, spesso facciamo ricorso a un pannello "Cerca e sostituisci", che richiede tempo. Invece, premi Comando + i per eseguire una ricerca dal vivo sul file corrente. Sarai stupito da quanto più veloce è questo metodo.
Naturalmente, Sublime Text fornisce supporto per la piegatura del codice multi-livello. Diciamo che stai lavorando su un foglio di stile e vuoi nascondere tutte le proprietà; scegli "Modifica -> Piegatura a freddo -> Piega tutto", o premi Comando + k + 1.
Bello! Per aprire tutti i blocchi, premere Comando + k + j.
Le combinazioni di tasti potrebbero richiedere del tempo per memorizzarle, ma ne vale la pena.
Non dimenticare che Sublime Text 2 è in fase di sviluppo. Vi incoraggio ad usare la versione di sviluppo, disponibile su sublimetext.com/dev. Non preoccuparti; anche se sono versioni di sviluppo, raramente incontri bug.
Il plugin Alignment, di Will Bond, aggiusterà istantaneamente il tuo codice per creare un codice più bello. Principalmente, viene utilizzato per garantire che il segno di uguale, =, per l'assegnazione di assegnazioni variabili.
Installato tramite Package Control, il plugin Alignment può essere attivato selezionando un pezzo di codice applicabile e premendo Control + Maiusc + a.
In effetti, il plugin tradurrà:
var first = 'Joe'; var last = 'Black'; var job_title = 'Morte'; var status = 'In vacanza';
In:
var first = 'Joe'; var last = 'Black'; var job_title = 'Morte'; var status = 'In vacanza';
Semplice, ma utile!
Chiaramente, ci sono molti altri segreti e trucchi in Sublime Text 2 ma questo elenco ti farà iniziare! Se vuoi saperne di più su questo fantastico editor, assicurati di fare riferimento al nostro prossimo corso: "Perfect Workflow in Sublime Text 2".
Accentsconagua