Offizielles Emmet-Plugin für Sublime Text.
Warnung: Dieses Plugin funktioniert unter einigen Betriebssystemen möglicherweise überhaupt nicht, da es in JavaScript geschrieben ist und zur Ausführung PyV8- und Google V8-Binärdateien verwendet. Wenn Probleme auftreten oder der Editor abstürzt, melden Sie bitte ein Problem.
Mit Paketkontrolle:
Emmet
Plugin.Manuell:
WARNUNG : Wenn das Plugin installiert ist, lädt es automatisch die erforderliche PyV8-Binärdatei herunter, sodass Sie etwas warten müssen (siehe Meldung „PyV8-Binärdatei wird in der Statusleiste geladen “). Wenn Sie Probleme mit dem automatischen PyV8-Loader haben, versuchen Sie, ihn manuell zu installieren.
Aktionen zum Erhöhen/Verringern der Nummer:
Sie können Emmet ganz einfach um neue Aktionen und Filter erweitern oder bestehende anpassen. Definieren Sie in Emmet.sublime-settings
die Einstellung extensions_path
und Emmet lädt beim Start alle .js
und .json
Dateien in den angegebenen Ordner.
Der Standardwert von extensions_path
ist ~/emmet
und verweist auf den Ordner emmet im Home-Ordner Ihres Betriebssystembenutzers.
Außerdem können Sie Abschnitte mit Namen als Erweiterungsdateien (z. B. snippets
, preferences
und syntaxProfiles
) in Emmet.sublime-settings
Datei des Benutzers erstellen und Ihre Anpassungen dort schreiben. Beispiele finden Sie in der Originaleinstellungsdatei.
Sublime Text ist ein großartiger Texteditor mit vielen Funktionen und Aktionen. Die meisten dieser Aktionen sind an Tastenkombinationen gebunden, sodass es nahezu unmöglich ist, praktische Plugin-Tastenkombinationen für Plugins von Drittanbietern bereitzustellen.
Wenn Sie mit der Standard-Tastaturbelegung nicht zufrieden sind, können Sie einzelne Tastaturkürzel mit der Voreinstellung disabled_keymap_actions
der Datei Emmet.sublime-settings
deaktivieren.
Verwenden Sie eine durch Kommas getrennte Liste von Aktionsnamen, deren Standardtastaturkürzel deaktiviert werden sollten. Wenn Sie beispielsweise die Tastenkombinationen Strg+E („Abkürzung erweitern“) und Strg+U („Bildgröße aktualisieren“) freigeben möchten, müssen Sie den folgenden Wert festlegen:
"disabled_keymap_actions": "expand_abbreviation, update_image_size"
Sie sollten auf die Datei Default (Your-OS-Name).sublime-keymap
verweisen, um Aktions-IDs zu erhalten (suchen Sie nach args/action
key).
Um alle Standardverknüpfungen zu deaktivieren, legen Sie den Wert auf all
fest:
"disabled_keymap_actions": "all"
Wenn Sie eine solche Aktion deaktiviert haben und Ihre eigene Tastenkombination erstellen, sollten Sie den Kontext emmet_action_enabled.ACTION_NAME
nicht verwenden, da dies die Taste ist, die die Aktion deaktiviert.
Emmet erweitert Abkürzungen nur in eingeschränkten Syntaxen: HTML, CSS, LESS, SCSS, Stylus und PostCSS. Der Grund für die Beschränkung des Tab-Handlers auf eine begrenzte Syntaxliste liegt darin, dass dadurch native Sublime-Text-Snippets beschädigt werden.
Wenn Sie in anderen Syntaxen (z. B. JSX, HAML usw.) mit Tab abkürzen möchten, müssen Sie die Einstellungen Ihrer Tastaturkürzel anpassen: Fügen Sie den Befehl expand_abbreviation_by_tab
für tab
für erforderliche Syntaxbereichsselektoren hinzu. Um die aktuelle Syntaxbereichsauswahl zu erhalten, drücken Sie ⇧⌃P (OSX) oder Strg+Alt+Umschalt+P . Sie wird in der Statusleiste des Editors angezeigt.
Gehen Sie zu Preferences
> Key Bindings — User
und fügen Sie das folgende JSON-Snippet mit der ordnungsgemäß konfigurierten Bereichsauswahl anstelle des SCOPE_SELECTOR
-Tokens ein:
{
"keys" : [ "tab" ] ,
"command" : "expand_abbreviation_by_tab" ,
// put comma-separated syntax selectors for which
// you want to expandEmmet abbreviations into "operand" key
// instead of SCOPE_SELECTOR.
// Examples: source.js, text.html - source
"context" : [
{
"operand" : "SCOPE_SELECTOR" ,
"operator" : "equal" ,
"match_all" : true ,
"key" : "selector"
} ,
// run only if there's no selected text
{
"match_all" : true ,
"key" : "selection_empty"
} ,
// don't work if there are active tabstops
{
"operator" : "equal" ,
"operand" : false ,
"match_all" : true ,
"key" : "has_next_field"
} ,
// don't work if completion popup is visible and you
// want to insert completion with Tab. If you want to
// expand Emmet with Tab even if popup is visible --
// remove this section
{
"operand" : false ,
"operator" : "equal" ,
"match_all" : true ,
"key" : "auto_complete_visible"
} ,
{
"match_all" : true ,
"key" : "is_abbreviation"
}
]
}
Mit dem Emmet-Plugin können Sie Abkürzungen wie normale Snippets mit der Tab -Taste erweitern. Andererseits kann es aufgrund der dynamischen Natur und der umfangreichen Syntax manchmal zu unerwarteten Ergebnissen kommen. In diesem Abschnitt wird beschrieben, wie der Tab-Handler funktioniert und wie Sie ihn optimieren können.
Standardmäßig funktioniert der Tab-Handler in einem begrenzten Syntaxbereich : HTML, XML, HAML, CSS, SASS/SCSS, LESS, PostCSS und Strings in Programmiersprachen (wie JavaScript, Python, Ruby usw.). Es bedeutet:
line
“ generiert, das die Ausgabe als einzelne Zeile generiert. Zur Feinabstimmung des Tab-Tasten-Handlers können Sie die folgenden Einstellungen in der Emmet.sublime-settings
Datei des Benutzers verwenden:
disable_tab_abbreviations_for_scopes
– eine durch Kommas getrennte Liste von Syntaxbereichen, in denen der Tab-Tasten-Handler deaktiviert werden sollte. Wenn Sie beispielsweise den Handler in Zeichenfolgen von Programmiersprachen und der HAML-Syntax deaktivieren möchten, sieht Ihre Einstellung folgendermaßen aus: "disable_tab_abbreviations_for_scopes" : " text.haml, string "
disabled_single_snippet_for_scopes
– eine durch Kommas getrennte Liste von Syntaxbereichen, in denen der Tab-Handler beim Erweitern einer einzelnen Abkürzung deaktiviert werden sollte. Derzeit stellt ST keine API zum Abrufen einer Liste nativer Snippets bereit. Wenn Sie beispielsweise versuchen, eine php
Abkürzung zu erweitern, wird diese an Emmet übergeben, das
anstelle des PHP-Blocks ausgibt, wie in nativen ST-Snippets definiert. Um dieses Problem zu umgehen: Wenn Sie versuchen, eine einzelne Abkürzung innerhalb des in der Einstellung disabled_single_snippet_for_scopes
definierten Bereichs zu erweitern, sucht Emmet zunächst in seinem eigenen Snippets-Katalog und dann in der Einstellung known_html_tags
nach ihrem Namen. Wenn sie nicht gefunden wird, kann ST damit umgehen Erweitern Sie die native Abkürzung, falls sie übereinstimmt.known_html_tags
– eine durch Leerzeichen getrennte Liste aller bekannten HTML-Tags, die wie oben beschrieben für die Suche verwendet werden. Wenn Sie mit dem Verhalten des Emmet-Tab-Handlers unzufrieden sind, können Sie es deaktivieren: Fügen Sie einfach "disable_tab_abbreviations": true
zur Datei Preferences.sublime-settings
des Benutzers hinzu.
Wenn Ihr Workflow bereits eine automatisierte Aufgabe für CSS-Anbieterpräfixe enthält (z. B. Autoprefixer), können Sie Emmets automatisches Einfügen von Anbieterpräfixen deaktivieren, indem Sie diese Option zur Emmet.sublime-settings
Datei Ihres Benutzers hinzufügen:
{
"preferences" : {
"css.autoInsertVendorPrefixes" : false
}
}