Lassen Sie .vue in der neuen Vorlage von Sublime Text hervorheben

Dieses Mal werde ich Ihnen die Vorsichtsmaßnahmen zum Hervorheben von .vue in einer neuen Sublime Text-Vorlage vorstellen. Das Folgende ist ein praktischer Fall.

In diesem Artikel werden die neue .vue-Vorlage und Highlights von Sublime Text vorgestellt (Bild- und Text-Tutorial), Sie können sie mit allen teilen und eine Notiz für sich selbst hinterlassen.

Vorbereitung

1. HerunterladenInstallierenNeues Dateivorlagen-Plug-in SublimeTmpl

2. Laden Sie das Vue-Syntax-Highlighting-Plug-in Vue Syntax Highlight herunter und installieren Sie es

Es gibt zwei Möglichkeiten, Plug-Ins für Sublime Text zu installieren:

1. Verwenden Sie die eigene Installationsbibliothek Package Control von Sublime Text, um

zu installieren Klicken Sie in der Menüleiste auf Einstellungen -> Paketkontrolle oder verwenden Sie die Tastenkombination STRG+UMSCHALT+P, um ein Terminalfenster zu öffnen, geben Sie Installieren ein und wählen Sie Paketkontrolle: Paket installieren, um

zu installieren 2. Direkt in das Paketverzeichnis (Einstellungen / Pakete durchsuchen) herunterladen. Chinesisch: (Einstellungen / Paketbrowser) Ordner

1. SublimeTmpl

2. Vue Syntax Highlight

Erstellen Sie eine .vue-Vorlage und aktivieren Sie die Syntaxhervorhebung

Nach der Installation von Vue Syntax Highlight können Sie Dateien im .vue-Format bereits beim Öffnen hervorheben. Jetzt richten wir Tastenkombinationen ein, um Dateien direkt im .vue-Format zu erstellen.

SublimeTmpl verfügt standardmäßig nur über 6 Syntaxvorlagen:

1. HTML Strg+Alt+h

2. Javascript Strg+Alt+j

3. CSS Strg+Alt+C

4. PHP Strg+Alt+P

5. Ruby Strg+Alt+R

6. Python Strg+Alt+Umschalt+p

Wir fügen jetzt eine neue Vorlage zum Erstellen des Vue-Formats hinzu

1. Vue-Dateivorlage erstellen

Öffnen Sie direkt den Ordner des Plug-In-Pakets Preferences -> Browse Packages

Einstellungen -> Pakete durchsuchen

Paketordner

Öffnen Sie den Ordner templates, in dem die Vorlagen gespeichert sind, kopieren Sie ein beliebiges Element und benennen Sie es in vue.tmpl

um Erstellen Sie vue.tmplvue.tmpl und ändern Sie den Inhalt in die gewünschte Vorlage

vue.tmpl-Inhalt

2. Ändern Sie das neue Menü und fügen Sie neue Vue-Optionen hinzu

Das neue Menü von SublimeTmpl verfügt standardmäßig nicht über Vue,

Neu -> Neue Datei (SublimeTmpl)

Klicken Sie auf die Menüoption oder öffnen Sie Einstellungen -> Paketeinstellungen -> Öffnen Sie den Menükonfigurationspunkt

Kopieren Sie ein Element, fügen Sie es dann ein und ändern Sie es in ein Vue-Element,

Vue-Element hinzugefügt

Nach dem Speichern der Änderungen erscheint das Vue-Element

im neuen Menü. Vue-Element

erscheint Klicken Sie auf das neue Vue-Element im Bild oben, und der zuvor festgelegte Vorlageninhalt wird angezeigt, es gibt jedoch keine Syntaxhervorhebung und er liegt im Nur-Text-Format vor

Erstellen Sie eine neue Vue-Datei

3. Hervorhebung der Vue-Syntax der Vorlagenbindung

Öffnen Sie Einstellungen -> Paketeinstellungen -> SublimeTmpl -> Öffnen Sie den Standardeinstellungspunkt

Kopieren Sie ein Element und ändern Sie es in vue. Der Pfad lautet wie folgt

Bindungs-Vue-Syntax

Für den mit der Bindungssyntax verknüpften Dateipfad überprüfen Sie bitte das Verzeichnis Sublime Text3DataCache, suchen Sie nach dem Namen des Vue-Highlighting-Syntax-Plug-Ins und öffnen Sie

Sublime Text3DataCache-Verzeichnis

Sublime Text3DataCachevue-syntax-highlight

Erstellen Sie erneut ein neues Vue-Menü und die Syntax wird hervorgehoben,

Erstellen Sie eine neue Vue-Datei

4. Binden Sie die Tastenkombination zum Erstellen einer neuen Vue-Datei

Öffnen Sie Einstellungen -> Paketeinstellungen -> SublimeTmpl -> Öffnen Sie die Einstellungsverknüpfungsdatei

Kopieren Sie ein Element und fügen Sie es ein, um eine neue Vue-Tastenkombination zu erstellen: Strg+Alt+V,

Erstellen Sie Tastenkombinationen

Nach dem Speichern ist auch das neue Menü verfügbar,

Neues Dateimenü

Probieren Sie es aus, perfekt!

Endlich

Die Datei scheint für die Konfiguration von Befehlen gedacht zu sein, und die Konfigurationsmethode ist die gleiche wie oben, folgen Sie einfach dem Beispiel einer Katze und eines Tigers~

Preferences -> Package Settings -> SublimeTmpl -> Settings - Commands

Der Letzte

Auf diese Weise können auch andere Sprachvorlagen selbst erstellt werden.

Ich glaube, dass Sie die Methode beherrschen, nachdem Sie den Fall in diesem Artikel gelesen haben. Weitere spannende Informationen finden Sie in anderen verwandten Artikeln auf der chinesischen PHP-Website!

Empfohlene Lektüre:

Das obige ist der detaillierte Inhalt vonLassen Sie .vue in der neuen Vorlage von Sublime Text hervorheben. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!