Heim > Entwicklungswerkzeuge > VSCode > So kompilieren Sie Sass mit vscode

So kompilieren Sie Sass mit vscode

Freigeben: 2019-12-31 14:38:53
Original
3715 Leute haben es durchsucht

So kompilieren Sie Sass mit vscode

Verwenden Sie vscode, um sass zu kompilieren

Der erste Schritt besteht darin, easy sass in vscode zu installieren. Das Bild unten zeigt den erfolgreichen Installationsstatus

So kompilieren Sie Sass mit vscode

Im zweiten Schritt ändern Sie die Konfiguration von vscode

"easysass.compileAfterSave": true, 
 "easysass.formats": [ //nested:嵌套缩进的 css 代码。
//expanded:没有缩进的、扩展的css代码。
//compact:简洁格式的 css 代码。
//compressed:压缩后的 css 代码

        {
            "format": "expanded",
            "extension": ".css"
        },
        {
            "format": "compressed",
            "extension": ".min.css"
        }
    ],
    "easysass.targetDir": "css/" //路径
Nach dem Login kopieren

Im dritten Schritt erstellen Sie einen neuen Ordner und erstellen zwei neue Ordner im Ordner, einen sass und einen css, falls Sie dies nicht getan haben Erstellen Sie einen CSS-Ordner. Nach dem Kompilieren wird automatisch ein Ordner

So kompilieren Sie Sass mit vscode

erstellt. Erstellen Sie dann demo.sass unter sass und schreiben Sie dann

Fünf Schritte , drücken Sie Strg + s, um direkt zu kompilieren. Da Sie easysass.compileAfterSave zuvor beim Einrichten auf true gesetzt haben, wird es nach dem Speichern einmal kompiliert. Dies dient auch der Verbesserung der Entwicklungseffizienz.

Das habe ich endlich gefunden Unter dem CSS befindet sich eine zusätzliche CSS-Datei, eine min.css-Datei. Diese hängt mit den Einstellungen zusammen, die Sie erneut festgelegt haben, und die andere ist komprimiert

So kompilieren Sie Sass mit vscode

Dieser Artikel stammt aus der Spalte Vscode-Tutorial der chinesischen PHP-Website.

Das obige ist der detaillierte Inhalt vonSo kompilieren Sie Sass mit vscode. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage