Lassen Sie uns über Probleme bei der Webstorm-Sass-Kompilierung sprechen

Dieser Artikel wurde in der Kolumne „Tutorial zur Verwendung von Webstorm“ verfasst, um die Sass-Kompilierungsprobleme unter Webstorm vorzustellen. Er hat einen gewissen Referenzwert und ich hoffe, dass er allen helfen kann.

Sass-Kompilierungsproblem unter Webstorm

Saas muss in einer Ruby-Umgebung ausgeführt werden, daher muss Ruby 32/64 installiert werden

1 Installieren Sie Ruby

2. Testen Sie, ob Ruby ​​ist installiert: ruby ​​​​-v (geben Sie Car zurück, wenn die Versionsnummer angezeigt wird, ist die Ruby-Installation erfolgreich)

3. Sass-Befehl installieren: gem install sass

4. Testen Sie, ob sass erfolgreich installiert wurde -v (Drücken Sie die Eingabetaste. Wenn die Versionsnummer angezeigt wird, ist die Sass-Installation erfolgreich)

Methode 1: DOS-Befehls-Sass-Konvertierung in CSS-Dateiüberwachung

1. Öffnen Sie im Dateiverzeichnis die DOS-Befehlszeilenmethode :shift + Rechtsklick

2. Geben Sie den Befehl sass in der Befehlszeile ein, um die Sass-Datei zu kompilieren. CSS-Dateien überwachen und kompilieren

sass style.scss mystyle.css
sass style.scss ../css/mystyle.css

: Wenn sass geändert wird, wird die CSS-Datei gleichzeitig geändert

sass --watch style.scss:../css/mystyle.css

3. Beenden Sie die Überwachung mit Strg + c, wähle y

Methode 2: Webstorm kommt mit integrierter Überwachung

1 Ein für alle Mal: ​​Konfiguration IDE-Umgebung:

IDE-Konfiguration (Speicherort: Einstellung --> Tools --> Datei Beobachter)

Wenn sass und css zwei Ordner zum Speichern von scss bzw. css sind:

Arguments：--style expanded --no-cache --update $FileName$:../css/$FileNameWithoutExtension$.css

Chinesischer Kompilierungsfehler: [Kann nicht verwendet werden. Alle Dateinamen und Anmerkungen mit chinesischen Schriftzeichen] Suchen Sie die Datei

1. Zeile 87 von librubygems2. 3.0gemssass-3.4.22libsassimportersfilesystem.rb

if name.index(@root + "/") == 0 修改为 if name.encode("utf-8",'gbk').index(@root + "/") == 0

2. Fügen Sie den folgenden Satz @charset „UTF“ zum Kopf der .scss-Datei hinzu –8“

Das obige ist der detaillierte Inhalt vonLassen Sie uns über Probleme bei der Webstorm-Sass-Kompilierung sprechen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!