Sublime Text3-Frontend-Plugin

Das Folgende ist eine Einführung in einige wichtige Sublime Text3-Frontend-Plug-Ins aus der Tutorial-Kolumne Erste Schritte mit Sublime . Ich hoffe, dass es für Freunde hilfreich ist, die es benötigen Es!

Package Control installieren

Bevor Sie das Plug-in installieren, müssen Sie Sublime Package Control installieren lassen. Öffnen Sie die Sublime Text-Konsole, verwenden Sie die Tastenkombination Strg + ~ und geben Sie den folgenden Code in die Konsole ein.

import urllib.request,os,hashlib; h = '2915d1851351e5ee549c20394736b442' + '8bc59f460fa1548d1514676163dafc88'; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) ); by = urllib.request.urlopen( 'http://packagecontrol.io/' + pf.replace(' ', '%20')).read(); dh = hashlib.sha256(by).hexdigest(); print('Error validating download (got %s instead of %s), please try manual install' % (dh, h)) if dh != h else open(os.path.join( ipp, pf), 'wb' ).write(by)

Plug-in installieren

emmet:

Front-End-Artefakt. Eine Toolbox-Komponente, die die HTML- und CSS-Arbeitseffizienz von Webentwicklern erheblich verbessern kann.

Einführung anzeigen

CSS3:

CSS3-Syntaxhervorhebung und CSS-Syntax-Eingabeaufforderungen Der einzige Nachteil ist das Fehlen der Hervorhebung privater Browserattribute.

Einführung ansehen

CSS Extended Completions:

CSS-Dateien verknüpfen, den Klassennamen in der CSS-Datei intelligent auffordern, sehr einfach zu verwenden.

Einführung anzeigen

JavaScript-Vervollständigungen

Unterstützt native Javascript-Syntax-Eingabeaufforderungen, sodass meine Mutter sich keine Sorgen mehr machen muss, dass ich document.getElementById(id) eingebe ).

Einführung anzeigen

jQuery

bietet Beispielcode-Snippets für die meisten Methoden von jQuery, wodurch die API von jQuery einfacher zu verwenden ist.

Einleitung ansehen

ColorHighlighter

Es kann den von Ihnen gewählten Farbcode anzeigen (wie „#FFFFFF“, „rgb(255,255,255)“, „weiß“) ist die wahre Farbe. Es enthält auch einen Farbwähler, mit dem Sie die Farben einfach ändern können.

Einleitung ansehen

BracketHighlighter

Die Klammern und Tag-Ebenen werden angezeigt, sodass Sie sich keine Gedanken darüber machen müssen, welcher Codeblock ausgewählt wurde Code gehört, es ist auf einen Blick klar.

Einführung anzeigen

HTML-CSS-JS Prettify

THML-, CSS-, JS-Codeformatierung, der komprimierte Code kann mit diesem Tool wiederhergestellt werden.

Einführung anzeigen

AlignTab

Verwenden Sie reguläre Ausdrücke, um die Codeausrichtung zu unterstützen, z. B. das Ausrichten mehrerer Codezeilen mit =-Zeichen.

Einführung ansehen

Die oben genannten Plug-ins decken HTML, CSS, JavaScript, jQuery, CSS-Farbanzeige, Hervorhebung auf Codeblockebene, Codeformatierung, Codeausrichtung ab. und erfüllen die absoluten Anforderungen der meisten Front-End-Anforderungen.

Was die Verwendung von Sass betrifft, installieren Sie Sass, Sassbuild, Git und laden Sie SublimeGit und Git Gutter herunter. Wenn Sie die Seitenleiste erweitern möchten, erweitern Sie die Seitenleiste Alles in allem ist dies nicht für jeden notwendig.

Hier ist ein weiteres Theme-Plug-in, das meiner Meinung nach relativ umfangreich ist, um visuelle Ermüdung zu vermeiden:

Colorsublime

Nachdem Wenn die Installation abgeschlossen ist, können Sie „Thema installieren“ aufrufen und das Thema online ändern. Es gibt Hunderte von Themen in der Bibliothek, was großartig ist.

Einführung ansehen

Das obige ist der detaillierte Inhalt vonSublime Text3-Frontend-Plugin. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!