Voglio cambiare / aggiungere l'evidenziazione della sintassi per una lingua in Sublime 2/3.

Ad esempio, voglio che la parola chiave sia thiscolorata in JavaScript.

Come lo posso fare?

So che è presente un file JavaScript delle preferenze C:\Program Files\Sublime Text 3\Packages, ma non so cosa modificare o se devo creare un nuovo file delle preferenze JavaScript da qualche parte in questa cartella %APPDATA%\Sublime Text 3.

L'evidenziazione della sintassi è controllata dal tema utilizzato, accessibile tramite Preferences -> Color Scheme. I temi evidenziano diverse parole chiave, funzioni, variabili, ecc. Attraverso l'uso di ambiti, che sono definiti da una serie di espressioni regolari contenute in un .tmLanguagefile nella directory / pacchetto di una lingua. Ad esempio, il JavaScript.tmLanguagefile assegna gli ambiti source.jse variable.language.jsalla thisparola chiave. Poiché Sublime Text 3 utilizza il .sublime-packageformato di file zip per memorizzare tutte le impostazioni predefinite, non è molto semplice modificare i singoli file.

Sfortunatamente, non tutti i temi contengono tutti gli ambiti, quindi dovrai giocare con quelli diversi per trovarne uno che abbia un bell'aspetto e ti dia l'evidenziazione che stai cercando. Esistono numerosi temi inclusi in Sublime Text e molti altri sono disponibili tramite Controllo pacchetto , che consiglio vivamente di installare se non lo hai già fatto. Assicurati di seguire le indicazioni ST3 .

In questo caso, ho sviluppato il Neon Color Scheme, disponibile tramite Package Control, che potresti voler dare un'occhiata. Il mio obiettivo principale, oltre a cercare di rendere una vasta gamma di lingue il più possibile valida, era identificare quanti più ambiti possibili - molti di più di quelli inclusi nei temi standard. Sebbene la definizione del linguaggio JavaScript non sia così completa come quella di Python, ad esempio, Neonha ancora molta più diversità rispetto ad alcuni dei valori predefiniti come Monokaio Solarized.

Dovrei notare che ho usato la Better JavaScriptdefinizione del linguaggio di @ int3h per questa immagine invece di quella fornita con Sublime. Può essere installato tramite Package Control.

AGGIORNARE

Di recente ho scoperto un'altra definizione del linguaggio sostitutivo di JavaScript - JavaScriptNext - ES6 Syntax. Ha più ambiti rispetto al JavaScript di base o addirittura a JavaScript migliore. Sembra questo sullo stesso codice:

Inoltre, poiché originariamente ho scritto questa risposta, @skuroda è stato rilasciato PackageResourceViewertramite Package Control. Ti consente di visualizzare, modificare e / o estrarre parti o interi .sublime-packagepacchetti senza problemi . Quindi, se lo desideri, puoi modificare direttamente gli schemi di colori inclusi in Sublime.

UN ALTRO AGGIORNAMENTO

Con il rilascio di quasi tutti i pacchetti predefiniti su GitHub , i cambiamenti sono avvenuti velocemente e furiosamente. La vecchia sintassi JS è stata completamente riscritta per includere le parti migliori di JavaScript Next ES6 Syntax, e ora è completamente compatibile con ES6. Una tonnellata di altri cambiamenti sono stati fatti per casi angolo di copertura e bordo, migliorare la coerenza, e nel complesso renderla migliore. La nuova sintassi è stata inclusa nell'ultima (in questo momento) dev build 3111.

Se desideri utilizzare una qualsiasi delle nuove sintassi con l'attuale build beta 3103, clona semplicemente il repository Github da qualche parte e collega JavaScript(o qualsiasi lingua desideri) nella tua Packagesdirectory: trovalo sul tuo sistema selezionando Preferences -> Browse Packages.... Quindi, di tanto in tanto fai semplicemente un git pullnella directory del repository originale per aggiornare le modifiche e puoi goderti l'ultima e la migliore! Dovrei notare che il repository utilizza il nuovo .sublime-syntaxformato anziché quello vecchio .tmLanguage, quindi non funzioneranno con le build ST3 precedenti al 3084 o con ST2 (in entrambi i casi, dovresti comunque aver aggiornato all'ultima beta o dev build).

Attualmente sto modificando il mio schema di colori neon per gestire tutti i nuovi ambiti nella nuova sintassi JS, ma la maggior parte dovrebbe essere già trattata.

Finalmente ho trovato un modo per personalizzare i temi forniti.

Vai a C:\Program Files\Sublime Text 3\Packagese copia + rinomina Color Scheme - Default.sublime-packagein Color Scheme - Default.zip. Successivamente decomprimilo e copia il tema che desideri modificare %APPDATA%\Sublime Text 3\Packages\User. (Nel mio caso, All Hallow's Eve.tmTheme).

Quindi puoi aprirlo con qualsiasi editor di testo e modificare / aggiungere qualcosa, ad esempio per modificare thisin JavaScript:

<dict>
    <key>name</key>
    <string>Lang Variable</string>
    <key>scope</key>
    <string>variable.language</string>
    <key>settings</key>
    <dict>
        <key>foreground</key>
        <string>#FF0000</string>
    </dict>
</dict>

Questo segnerà thisin rosso i file JavaScript. Puoi selezionare il tuo tema sotto Preferences -> Color Scheme -> User -> <Your Name>.

Usa il plugin PackageResourceViewer installato tramite Package Control (come menzionato da MattDMo ). Ciò ti consente di sovrascrivere le risorse compresse semplicemente aprendolo in Sublime Text e salvando il file. Salva automaticamente solo le risorse modificate in% APPDATA% / Roaming / Sublime Text 3 / Packages / o ~ / .config / sublime-text-3 / Packages /.

Specifico per l'op, una volta installato il plugin, eseguire il PackageResourceViewer: Open Resourcecomando. Quindi selezionare JavaScriptseguito da JavaScript.tmLanguage. Questo aprirà un file xml nell'editor. È possibile modificare qualsiasi definizione della lingua e salvare il file. Questo scriverà una copia di sostituzione del file JavaScript.tmLanguage nella directory dell'utente.

Lo stesso metodo può essere utilizzato per modificare la definizione della lingua di qualsiasi lingua nel sistema.

Il "questo" è già colorato in Javascript.

Visualizza-> Sintassi-> e scegli la lingua da evidenziare.

Questa è la mia ricetta

Nota: questo non è esattamente ciò che chiede OP. Queste istruzioni ti aiuteranno a cambiare i colori degli elementi (commenti, parole chiave, ecc.) Che sono regole di corrispondenza della sintassi definite. Ad esempio, utilizzare queste istruzioni per modificare in modo che tutti i commenti sul codice siano colorati in blu anziché in verde.

Credo che l'OP chieda come definire thisun elemento da colorare quando viene trovato in un file sorgente JavaScript.

1. Installa pacchetto: PackageResourceViewer

2. Ctrl+Shift+P> [ PackageResourceViewer: Open Resource]> [ Color Scheme - Default]> [ Marina.sublime-color-scheme] (o qualunque combinazione di colori utilizzi)

3. Il comando precedente aprirà una nuova scheda nel file " Marina.sublime-color-scheme".

   • Per me, questo file si trovava nel mio profilo di roaming %appdata%( C:\Users\walter\AppData\Roaming\Sublime Text 3\Packages\Color Scheme - Default\).
   • Tuttavia, se cerco quel percorso in Windows Explorer , [ Color Scheme - Default] non è di una directory figlio di [ Packages] dir. Sospetto che PackageResourceViewerstia facendo un po 'di virtualizzazione.

passaggio facoltativo: nella nuova scheda dello schema di colori: Ctrl+Shift+P> [ Set Syntax: JSON]

4. Cerca la regola che desideri modificare. Volevo rendere visibili i commenti, quindi ho cercato " Comment"

   • L'ho trovato nella "rules"sezione

 "rules":
    [
        {
            "name": "Comment",
            "scope": "comment, punctuation.definition.comment",
            "foreground": "var(blue6)"
        },

5. Cerca la stringa "blue6":per trovare la sezione delle definizioni delle variabili di colore. L'ho trovato nella "variables"sezione.

6. Scegli un nuovo colore utilizzando uno strumento come http://hslpicker.com/ .

7. Definisci una nuova variabile di colore o sovrascrivi l'impostazione del colore per blue6.

   • Attenzione: la sovrascrittura blue6avrà effetto su tutti gli altri elementi di testo in quella combinazione di colori che utilizzano anche blue6 ("Punteggiatura" "Accessor").

8. Salva il tuo file, le modifiche verranno applicate immediatamente a tutti i file / schede aperti.

APPUNTI

Sublime gestirà uno qualsiasi di questi stili di colore. Forse di più.

hsla = tonalità, saturazione, luminosità, alfa rgba = rosso, verde, blu, alfa

hsla (151, 100%, 41%, 1) - l'ultimo parametro è il livello alfa (trasparenza) 1 = opaco, 0,5 = semitrasparente, 0 = completamente trasparente

hsl (151, 100%, 41%) - nessun canale alfa

rgba (0, 209, 108, 1) - rgb con un canale alfa

rgb (0, 209, 108) - nessun canale alfa