Share
Unabhängig von der Sprache sollten Fehler auf saubere und einfache Weise gehandhabt werden, sei es für den Endbenutzer oder den nächsten Entwickler. Wenn Sie eine falsche Aktion für eine Site ausführen, sollte Sie nicht nur ein Fehlercode oder ein fehlgeschlagener Befehl angezeigt werden. Es sollte Sie mit einer expliziten Nachricht darüber informieren, was los ist.
Dies sollte bei der Programmierung für andere Entwickler nicht anders sein. Wenn Sie eine Bibliothek oder ein Framework erstellen oder einfach in einem Team arbeiten, können Sie nicht nur den Code verwenden. Möglicherweise müssen viele Entwickler mit sehr unterschiedlichen Hintergründen Ihren Code verwenden, und sie sollten nicht tief in die Quelle und die Wendungen Ihres Geistes eintauchen müssen, um herauszufinden, was los ist.
Deshalb sollten Sie Fehler richtig behandeln. Sogar in Sass. Auch wenn es zu etwas so freizügigem wie CSS kompiliert wird. Wenn Sie eine benutzerdefinierte Funktion oder ein Mixin erstellen, sollten Sie immer sicherstellen, dass alles wie erwartet funktioniert. Wenn dies nicht der Fall ist, sollten Sie einen anderen Weg einschlagen.
Ich weiß es nicht für dich, aber ich mag es wirklich nicht, wenn der Sass-Compiler ausfällt. Ich hätte lieber eine coole kleine Nachricht, die mir erklärt, dass ich einen Streit vergessen habe, anstatt mich zu stellen:
Lange Geschichte kurz: Fehler richtig behandeln. Ich zeige dir wie.
Beim Erstellen einer Funktion müssen Sie zunächst sicherstellen, dass alle Argumente angegeben sind. Leider geht Sass nicht einmal in die Funktion, wenn die Anzahl der übergebenen Argumente falsch ist. Glücklicherweise behandelt der Compiler dies mit einer Nachricht wie: Mixin my-awesome-mixin fehlt das Argument $ the-awesome-argument. also ist es nicht so schlimm.
Wenn Sie dies nicht in den Händen des Compilers belassen möchten und lieber selbst damit umgehen möchten, können Sie dies umgehen, indem Sie für alle Argumente aus der Funktion / mixin Standardparameter angeben. Es ist nicht nur besser für den Endbenutzer, keine Angaben machen zu müssen alles Argumente jeden einmalig, aber es ermöglicht Ihnen auch, das Mixin / die Funktion in allen Fällen auszulösen und zu tun, was immer getan werden muss.
Das Wichtigste ist jetzt, sicherzustellen, dass alle Argumente gültig sind. Wenn Sie beispielsweise eine Farbe benötigen, müssen Sie sicherstellen, dass der Entwickler tatsächlich eine Farbe an die Funktion weitergibt und nicht eine Zahl oder eine Zeichenfolge. Wenn Sie eine Liste mit drei Werten benötigen, sollten Sie die Länge überprüfen, um sich zu vergewissern sind drei Werte, nicht zwei oder vier.
Glücklicherweise macht es Sass sehr einfach, dies mit einer Reihe von Standardfunktionen zu tun, einschließlich Art der() um den Datentyp eines Wertes zu überprüfen. Übrigens sollte Sass 3.4 sogar einführen is-type-of ($ value, $ type) um das Problem der Testart zu umgehen () die immer wiederkehrt Liste während es auch eine Karte sein kann.
Selbst wenn Sie einen Code für Entwickler mit guten Sass-Kenntnissen schreiben, sollten Sie auf die Eingabe Ihrer Funktionen achten.
Zum Beispiel beim Tun $ value: $ input + "px", Sie gießen im Grunde eine Zahl (wenn $ input ist eine Zahl, offensichtlich) zu einer Zeichenfolge. Dann, wenn Sie versuchen, es zu tun $ wert * 2, Sass gibt einen Fehler aus, weil Sie versuchen, eine Zeichenfolge zu multiplizieren. Weitere Informationen zu diesem Phänomen in diesem Artikel.
Der Umgang mit Fehlern im Falle einer benutzerdefinierten Funktion ist eigentlich ganz einfach: Sie überprüfen, ob etwas überprüft werden muss. Wenn die Bedingung nicht übereinstimmt, kehren Sie zurück falsch (oder Null, siehe unten) und warnen den Benutzer mit Hilfe des @warnen Sass-Richtlinie.
@ function add-10 ($ number) @if type-of ($ number)! = "number" @warn "'# $ number' ist keine Nummer von 'add-10'."; @falsch zurückgeben; @return $ number + 10 zurückgeben;
In diesem (ziemlich albernem zustimmen) Fall, wenn die $ number Argument ist keine Zahl, die Funktion wird zurückgegeben falsch und der Benutzer wird durch eine in seinem Terminal erscheinende Nachricht darauf hingewiesen, dass er ein falsches Argument übergeben hat: 'SWAG' ist keine Nummer für 'Add-10'.
Wenn das Argument gültig ist, wird einfach die Zahl + 10 zurückgegeben. Einfach als Kuchen.
Beim Umgang mit einem Mixin ist es etwas komplizierter, da Sie eigentlich nichts zurückgeben. Stattdessen werden CSS-Regeln ausgegeben. Um das Problem zu umgehen, müssen Sie einen Boolean deklarieren, der als Gültigkeitsprüfer dient. Bitte beachten Sie folgendes Beispiel:
@mixin module ($ name) // Eine Gültigkeitsprüfung initialisieren Boolean $ everything-okay: true; // Überprüfung der Gültigkeit des Arguments @if type-of ($ name)! = "String" @warn "'# $ name' ist kein String für 'module'."; $ alles-okay: falsch; // Wenn alles noch in Ordnung ist, mischen Sie den Inhalt mit Inhalt @if $ everything-okay @content;
Wenn Sie sicherstellen möchten, dass eines der Argumente eine Liste mit mehreren Elementen ist, sollten Sie immer die Länge und nicht den Datentyp testen. Einfach ausgedrückt, behandelt Sass alle Werte als Einzelelementlisten. In einigen Fällen können Sie sich auch mit einer Einzelelementliste befassen, die eigentlich immer noch eine ist Liste.
Auf der anderen Seite ein mögliches Problem bei der Überprüfung der Länge ist, dass es eine sein kann Karte auch. Um absolut sicher zu gehen, dass Sie mit einer Liste mehrerer Werte konfrontiert werden, gehen Sie folgendermaßen vor:
@if length ($ value)> 1 und type-of ($ value)! = map // Dies ist eine Liste mit mehreren Werten
Wenn ich ganz ehrlich bin, würde ich niemals sagen. Sie können niemals zu vorsichtig sein und möglicherweise nach Argumenten für Funktionen und Kombinationen Ihrer Anwendung suchen. Das ist aber wahrscheinlich nicht nötig. Ich habe eine goldene Regel, wenn es um Argumente geht: Wenn der Wert wahrscheinlich zum Absturz des Sass-Compilers führt, sollten Sie ihn überprüft haben.
Das bedeutet, wenn Sie ein Mixin haben, das Argumente akzeptiert, die direkt als Werte für CSS-Eigenschaften verwendet werden, glaube ich nicht, dass es sinnvoll ist, sie aggressiv zu überprüfen. Im schlimmsten Fall werden diese Werte in der CSS-Ausgabe gespeichert, was zu ungültigem CSS führt, das vom Browser nicht verstanden wird. Abgesehen von ein paar zusätzlichen Bytes, wird es keinen großen Schaden geben.
Betrachten Sie zum Beispiel das folgende Mixin:
@Mixin-Größe ($ width, $ height: $ width) width: $ width; Höhe: $ Höhe;
Und nun betrachten Sie die folgende Verwendung:
.Element @ include size (10, "string");
Das resultierende CSS wird sein:
.Element Breite: 10; Höhe: "String";
Jeder Browser lehnt einfach beide Eigenschaften ab, da ihre Werte ungültig sind. Keine große Sache.
Mit dem, was wir gerade gesehen haben, sollten Sie in der Lage sein, 99% der möglichen Fehler korrekt zu behandeln, jedoch dort ist ein Fall, in dem es schwieriger wird, mit Sass Schritt zu halten: beim Umgang mit Fehlern einer Funktion, die von einer Funktion aufgerufen wird, die von einer Funktion aufgerufen wird…
Genau das habe ich mit SassyJSON, einem in Sass geschriebenen JSON-Parser, erlebt. Grundsätzlich übergeben Sie einen JSON-String an Json-Decode Funktion, die es an die weiterleitet _json-decode - wert Funktion, die es dann an a weiterleitet _json-decode - * Funktion abhängig vom Typ des Wertes, der analysiert wird. Jedenfalls war es nicht ungewöhnlich, dass drei, vier, vielleicht fünf Funktionsaufrufe ineinander verschachtelt waren.
In einem solchen Fall gibt es leider keine saubere Möglichkeit, die Ausführung zu stoppen. Sie müssen Ihre Fehler in die obere Ebene sprudeln lassen, indem Sie die Funktionsrückgabe auf jeder Ebene manuell überprüfen. Wenn Sie z. B. einen Fehler in der tiefsten Funktion haben, sollte die aufrufende Funktion false zurückgeben, die dann diesen Wert überprüfen sollte falsch, Kehren Sie also zur oberen Funktion zurück und so weiter, bis Sie die höchste erreichen, die dann die Ausführung stoppt.
Das ist ziemlich schmerzvoll, aber es gibt keine Wahl. Wenn Sie jedoch mehrere Ebenen von Funktionen verschachteln müssen, würde ich sagen, dass Sie Sass nicht korrekt verwenden.
Wenn etwas schief geht, können Sie verschiedene Werte zurückgeben, falsch und Null die beliebtesten zu sein. Ich denke, du könntest zurückkehren -1 oder ungültig 0 wenn Sie aus einem JavaScript-Hintergrund stammen. Ich denke, du könntest auch so etwas zurückgeben FEHLERCODE Dies würde jedoch die Überprüfung auf einen Fehler etwas komplizierter machen.
Ich komme zurück falsch weil das für sich spricht: es ist falsch. Dies kann jedoch ein Problem mit Funktionen sein, die einen Boolean-Wert zurückgeben sollen. Wie würden Sie wissen, wenn die Funktion zurückkehrt? falsch weil das Ergebnis ausgewertet wurde falsch, oder falsch weil ein Fehler aufgetreten ist?
Sie können sich also entscheiden, einen anderen Wert auszuwählen. Es gibt eine interessante Sache mit Null: eine CSS-Eigenschaft mit einem Wert von Null wird nicht zur Quelle kompiliert. Im Grunde bedeutet dies, dass, wenn Sie eine Sass-Funktion als Wert für eine CSS-Eigenschaft verwenden und etwas nicht stimmt, die CSS-Eigenschaft vom Sass-Compiler einfach weggelassen wird.
Ich denke, das ist für so etwas irgendwie nett:
Accentsconagua
.element background: get-color-from-theme ('admin'); Wenn die funktion get-color-from-theme wurde gut entworfen, sollte es sicherstellen, dass Administrator Theme existiert und ist eigentlich an einen Farbwert gebunden. Ob Administrator existiert nicht, dann würde die Funktion zurückkehren Null was dazu führen würde Hintergrund: null. Dies führt dazu, dass Sass die Regel beim Kompilieren der Datei in CSS auslässt.
werfen() FunktionDie meisten Sprachen haben eine werfen Funktion oder Direktive. Normalerweise akzeptiert diese Funktion eine Fehlermeldung oder eine Ausnahme als einziges Argument und stoppt einfach die Skriptausführung, um diese Meldung anzuzeigen (in der Konsole oder in etwas anderem), wenn ein Fehler auftritt. In JavaScript können Sie beispielsweise Folgendes tun:
if (typeof myVariable === "undefined") Neue UserException auslösen ("'myVariable' sollte definiert werden"); Leider hat Sass das nicht. Grundsätzlich gibt es in Sass absolut keine Möglichkeit, die Ausführung einer Funktion oder eines Mixins zu stoppen. Sie könnten eine bauen, aber die Funktion würde praktisch nicht gestoppt, es würde nur false zurückgeben und eine Nachricht protokollieren.
@Funktionsauswurf ($ log) @warn $ log; @falsch zurückgeben;
Anstatt manuell zu schreiben @warnen Richtlinie und die @falsch zurückgeben Sie können jedes Mal die werfen() funktionieren, denken Sie jedoch daran, dass es keine Zauberei gibt oder das Skript nicht ausgeführt wird. Es gibt einfach 'false' zurück und protokolliert eine Fehlermeldung.
Dass gesagt wurde, eine zu haben werfen Sass-Betreuern wurde schon einige Male eine Direktive gebeten, und es scheint, dass sie zugestimmt haben, dass es nicht so schlimm wäre, eine @Error Direktive, die den aktuellen Geltungsbereich gemäß Ausgabe 747 bricht. Vielleicht für 3.4 bin ich mir nicht sicher.
Unabhängig davon, wie Sie es tun, sollten Sie immer die Funktion und die Mixing-Eingänge überprüfen, anstatt den Compiler abstürzen zu lassen, da etwas Unerwartetes aufgetreten ist. Als Entwickler hätte ich lieber ein sauberes Protokoll und nichts ausgegeben als eine riesige Stack-Ablaufverfolgung, aber auch das bin ich nicht.
Als Live-Beispiel schlage ich vor, dass Sie sich eine kleine Schaltflächenbibliothek ansehen, die ich vor einiger Zeit erstellt habe. Der größte Teil des Codes aus dem Core-Mixin besteht aus der Prüfung von Argumenten und der Fehlerbehandlung. Das Mixin wirkt dadurch sehr voll, aber ich denke, es ist für Entwickler, die den Code verwenden, unerlässlich.
Stellen Sie am Ende sicher, dass Sie etwas finden, das sowohl zu Ihnen als auch zu Ihrem Team passt.
