@Error verantwortungsbewusst in sass verwenden

Schlüsselpunkte

• Die @error -Richtlinie in SASS ist ein leistungsstarkes Werkzeug zur Steuerung der Autoreneingaben und zum Werfen von Fehlern, wenn Probleme auftreten, was effektiver ist als das Erlauben von Compiler -Fehlern.
• Für ältere Versionen von SASS, die @error nicht unterstützen, können Sie stattdessen die @warn -Richtlinie verwenden. Um sicherzustellen, dass der Compiler immer noch abfällt, wenn ein Fehler auftritt, kann ein Hybrid -Makro erstellt werden, der nach einer Warnung einen Kompilierungsfehler auslöst.
Die Funktion
• feature-exists('at-error') kann verwendet werden, um zu überprüfen, ob @error unterstützt wird. Wenn Sie nicht unterstützt werden, verwenden Sie die Anweisung @warn und verwenden Sie eine Funktion ohne die @return -Anweisung, um den Compiler zu stürzen.
• log Funktionen können in anderen Funktionen verwendet werden, und log Hybrid -Makros können an anderer Stelle verwendet werden, wodurch Fehler verantwortungsbewusst werden. Dies ermöglicht eine effiziente Fehlerverwaltung für verschiedene Versionen von SASS.

Da Ruby Sass 3.4 und Libsass 3.1 die @error -Richtlinie verwendet werden kann. Diese Richtlinie ähnelt @warn und ist so konzipiert, dass sie den Ausführungsprozess beenden und eine benutzerdefinierte Nachricht an den aktuellen Ausgabestream (wahrscheinlich die Konsole) anzeigen.

unnötig zu erwähnen, dass diese Funktion beim Erstellen von Funktionen und gemischten Makros sehr nützlich ist, die eine SASS -Logik beinhalten, um die Eingabe des Autors zu steuern und Fehler zu werfen, wenn Probleme auftreten. Sie müssen zugeben, dass dies besser ist, als den Compiler scheitern zu lassen, oder?

Alles ist gut. Außer SASS 3.3 wird noch weit verbreitet. Sass 3.2 wird an einigen Stellen sogar verwendet. Das Aktualisieren von SASS ist insbesondere in großen Projekten nicht einfach. Manchmal ist es nicht möglich, Zeit und Budget zu verbringen, um etwas zu aktualisieren, das ordnungsgemäß funktioniert. Für diese älteren Versionen ist @error bedeutungslos und wird als benutzerdefinierte at-directive angesehen, das aus Gründen der Vorwärtskompatibilität vollständig in SASS zulässig ist.

bedeutet dies, dass wir @error nicht verwenden können, wenn wir uns nicht entscheiden, nur die neueste SASS -Engine zu unterstützen? Nun, Sie können sich vorstellen, dass es einen Weg gibt, also mit diesem Beitrag.

Was ist die Idee?

Die Idee ist einfach: Wenn Sie @error unterstützen, werden wir sie verwenden. Ansonsten verwenden wir @warn. Obwohl @warn den Compiler nicht daran hindert, die Ausführung fortzusetzen, möchten wir möglicherweise nach einer Warnung einen Kompilierfehler auslösen, damit der Compiler vollständig abstürzt. Genießen Sie, Sie müssen nicht oft etwas Unbestimmtes zerstören.

Dies bedeutet, dass wir den gesamten Inhalt in ein gemischtes Makro einwickeln müssen, nennen wir es log(...). Wir können es so verwenden:

<code>@include log('哎呀，你刚才的操作出了问题！');</code>

Sie müssen zugeben, es ist cool, nicht wahr? Ok, prahe genug, lass es uns bauen.

bauen logger

bauen

Also funktioniert unser Hybrid -Makro genauso wie @error oder @warn, weil es nur eine Wrapper ist. Daher erfordert es nur einen Parameter: Nachricht.

<code>@include log('哎呀，你刚才的操作出了问题！');</code>

Sie können sich fragen, wie wir die Unterstützung @error überprüfen werden. Zuerst hatte ich eine ungeschickte Lösung mit dem Schnüffeln von Versionen, aber das war schrecklich. Darüber hinaus habe ich die Tatsache völlig übersehen, dass SASS -Kerndesigner kluge Leute sind, die das Ganze berücksichtigt und den feature-exists(...) -Taste in die at-error -Funktion eingeführt haben, und zurückgibt, ob die Funktion unterstützt wird oder nicht.

<code>@mixin log($message) { ... }</code>

Wenn Sie ein Patch -Beschreibungsleser sind, wissen Sie wahrscheinlich, dass die feature-exists(...) -Funktion nur in SASS 3.3 eingeführt wird. Es deckt Sass 3.2 nicht ab! OK, ein Teil davon ist wahr. In SASS 3.2 wird feature-exists('at-error') als Wahrheit bewertet. Durch das Hinzufügen von == true stellen wir sicher, dass SASS 3.2 diesen Zustand nicht eingibt und zur @warn -Version wechseln.

Bisher lief alles gut. Obwohl wir nach Warnung einen Kompilierfehler auslösen müssen. Wie werden wir das machen? Es gibt viele Möglichkeiten, Sass zu stürzen, aber im Idealfall möchten wir etwas bekommen, das Sie erkennen können. Eric Suzanne hat sich zuvor eine Idee ausgedacht: Aufrufen von Funktionen ohne @return Anweisungen reicht aus, um zu stürzen. Dieser Modus wird oft als noop bezeichnet, d. H. Keine Operation . Grundsätzlich ist dies eine leere Funktion, die nichts tut. Aufgrund der Funktionsweise von Sass stürzt der Compiler ab. Das ist sehr gut!

<code>@mixin log($message) {
  @if feature-exists('at-error') == true {
    @error $message;
  } @else {
    @warn $message;
  }
}</code>

Wie werden wir diese Funktion zuletzt nennen? Die Sass -Funktion kann nur an einem bestimmten Ort aufgerufen werden. Wir haben verschiedene Methoden zur Verfügung:

• Eine Dummy -Variable, zum Beispiel: $_: noop()
• Eine virtuelle Eigenschaft, zum Beispiel: crash: noop()
• eine leere Bedingung, zum Beispiel: @if noop() {}
• Sie können mehrere andere Möglichkeiten finden, diese Funktion aufzurufen.

Ich möchte Sie warnen, $_ nicht zu verwenden, da es in Sass -Bibliotheken und Frameworks eine gemeinsame Variable ist. Während es in SASS 3.3 in SASS 3.2 möglicherweise kein Problem darstellt, wird dies alle globalen $_ Variablen außer Kraft setzen, was in einigen Fällen zu schwer zu verfolgenden Problemen führen kann. Verwenden wir den Nullzustand, da er bei Verwendung mit noop sinnvoll ist. Eine Noop -Bedingung für die Noop -Funktion.

<code>@function noop() {}</code>

Okay! Testen wir es mit dem vorherigen Code:

<code>@mixin log($message) {
  @if feature-exists('at-error') == true {
    @error $message;
  } @else {
    @warn $message;
    // 由于函数不能在 Sass 中的任何地方调用，
    // 我们需要在一个虚拟条件中进行调用。
    @if noop() {}
  }
}</code>

Folgendes lautet libssass:

<code>@include log('哎呀，你刚才的操作出了问题！');</code>

Folgendes ist SASS 3.4:

<code>message:
path/to/file.scss
1:1  哎呀，你刚才的操作出了问题！
Details:
column: 1
line: 1
file: /path/to/file.scss
status: 1
messageFormatted: path/to/file.scss
1:1  哎呀，你刚才的操作出了问题！</code>

Folgendes sind SASS 3.2 und 3.3 (die Ausgabe ist eine mutige Vermutung, da ich diese Versionen nicht leicht in meinem Terminal testen kann):

<code>Error: 哎呀，你刚才的操作出了问题！
在 path/to/file.scss 的第 1 行，位于 `log` 中
使用 --trace 获取回溯。</code>

Das scheint zu funktionieren! In jedem Motor, sogar dem alten Motor, wird der Compiler verlassen. Bei diesen Motoren, die @at-error unterstützen, erhalten sie sofort eine Fehlermeldung. Bei diesen nicht unterstützten Motoren erhalten sie Nachrichten als Warnungen und stürzen dann die Zusammenstellung aufgrund der Noop -Funktion ab.

Aktivieren Sie es, um Protokolle in der Funktion

aufzuzeichnen

Das einzige Problem mit unserem aktuellen Setup ist, dass wir keinen Fehler aus der Funktion werfen können, da wir ein Hybrid -Makro erstellt haben. Gemischte Makros können nicht in eine Funktion einbezogen werden (da es den CSS -Code ausdrucken kann, was nichts mit der Sass -Funktion zu tun hat)!

Was ist, wenn wir das gemischte Makro zuerst in eine Funktion konvertieren? Zu diesem Zeitpunkt passierte etwas Seltsames: @error wird nicht als gültige Funktion in SASS 3.3- erkannt, daher wird es kläglich scheitern: at-directive

Funktionen können nur variable Deklarationen und Kontrollanweisungen enthalten.

fair sein. Dies bedeutet, dass wir keine Noop -Hacks mehr brauchen, da nicht unterstützte Motoren abstürzen, ohne dass wir sie erzwingen müssen. Obwohl wir die

-Richtlinie über den Prozess stellen müssen, damit die Nachricht vor dem Absturz in die Konsole des Autors gedruckt wird. @warn

<code>@include log('哎呀，你刚才的操作出了问题！');</code>

Wir können dann ein Hybrid -Makro zur Verfügung stellen, um eine freundlichere API als schmutzige Nullbedingungen und Dummy -Variable -Hack zu erhalten.

<code>@mixin log($message) { ... }</code>

Endgültige Gedanken

Das ist es! Wir können jetzt die

-Funktion in der Funktion verwenden (aufgrund von Einschränkungen) und das log(...) hybride Makro überall sonst verwenden, um verantwortungsbewusst Fehler zu werfen. Sehr ordentlich! log(...)

Hier ist der vollständige Code: (hier sollte hier ein volles Code -Beispiel bereitgestellt werden, aber ich kann jedoch keinen Runnable -Code -Snippet angeben, da die Code nicht direkt ausgeführt werden kann)

Probieren Sie diesen Wild auf Sassmeister. (SassMeister -Link sollte hier bereitgestellt werden)

Für fortschrittlichere Protokollierungssysteme in SASS empfehle ich, dass Sie "Logger Hybrid -Makros Build" lesen. In Bezug auf die Unterstützung älterer Versionen von SASS empfehle ich Ihnen, wann und wie Sie mehrere Versionen von SASS unterstützen können.

(Der FAQ -Abschnitt zur verantwortungsvollen Verwendung von Fehlern in SASS sollte hier enthalten sein, aber ich habe es aufgrund von Platzbeschränkungen weggelassen.)

Das obige ist der detaillierte Inhalt von@Error verantwortungsbewusst in sass verwenden. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!