2016-06-26 12 views
2

Ich habe gerade etwas Sass gelernt mit codecademy.com, und ich habe keine Ahnung, wie man "compile" meine main.scss Datei zu meiner main.css Datei. Weiß jemand, wie ich dies mit Notepad ++ und/oder Sublime Text als meinen Texteditor (en) machen kann?Wie kompilieren Sie SASS-Code zu CSS?

+0

http://www.hongkiat.com/blog/sublime-text-compiling-sass/ –

+0

@mparnisari Eeeks ... Wann hast du auch dieses Kommentar? –

+1

'main.scss' zu' main.sass' oder 'main.css'? –

Antwort

5

Sie benötigen den SASS Pre-Processor, um SASS in CSS zu kompilieren. Sie sollten entweder Compass oder SASS zum kompilieren verwenden. Wenn Sie an Ihrem Projekt arbeiten, können Sie den Kompass-Beobachter ausführen, um Ihre CSS-Dateien auf dem neuesten Stand zu halten, wenn Änderungen vorgenommen werden.

$ cd /path/to/project 
$ compass watch 

Compiling Sass into CSS in Sublime Text ist möglich, mit einem Plugin SassBuilder genannt, die Sie durch Package Control (siehe Screenshot) installieren können.

SASS Builder

BTW, eine kurze Frage. main.scss bis main.sass oder main.css?

+2

main.scss zu main.css Entschuldigung –

+0

@KeeganBrown Great. BTW, hilft meine Antwort Ihnen? –

2

Es gibt drei Optionen:

  1. Als eine andere Person erwähnt Sie einen Text-Editor mit Sass-builder in als eine der Optionen verwenden können. Dies ist die einfachste Möglichkeit. Möglicherweise müssen Sie Ruby noch installieren, damit es funktioniert.

  2. Sie können einen Pre-Prozessor wie Gulp oder Grunt verwenden, um es für Sie zu tun. Ich empfehle Gulp für Anfänger.

  3. Sie es durch das Herunterladen SASS über Ruby-Paket-Manager manuell tun können:

    • installieren Rubin: https://www.ruby-lang.org/en/downloads/
    • öffnen Powershell oder Terminal und navigieren "gem install sass" in Ihr Projektverzeichnis
    • Typ sass installiert haben .
    • Erstellen Sie nun ein Verzeichnis mit all Ihren Sass-Dateien und ein weiteres mit dem Ziel der CSS-Datei.
    • Typ sass --watch "yoursassdirectory"/style.scss : "yourcssdirectory"/style.css
    • Jetzt wird Sass Ihre Sass-Dateien ansehen und kompilieren, während Sie sie speichern.