Im Allgemeinen wir nicht einen bestimmten Stil, um gewährleisten müssen. Komponentenstile (standardmäßig) funktionieren unabhängig von anderen Stilen in anderen Komponenten und in der Reihenfolge, in der die Stile verarbeitet werden.
Die Verarbeitungsreihenfolge der Sass Dateien nicht im CLI garantiert, gibt es eine Ordnung, die die Reihenfolge der CLI-Plugins (Webpack basiert), um die Dateien, in denen verarbeiten aber das könnte im Laufe der Zeit als die CLI entwickelt sich ändern .
Eines der Hauptziele des Angular-Designs besteht darin, die -Stilkapselung bereitzustellen, was bedeutet, dass die Stile der der Komponente zugeordneten SASS-Datei nur für diesen Stil gelten.
Um zu verstehen, wie das funktioniert und warum im allgemeinen wir nicht brauchen, um Stil, um sich Sorgen zu machen, wollen wir als Beispiel in einer Komponente SASS Datei diese Art nehmen:
.active {
border-radius:4px;
}
Dieser konvertiert werden zur Laufzeit zu so etwas wie:
.active[_concontent-c1] {
border-radius:4px;
}
Was in den spitzen Klammern geht, ist ein einzigartige Attributbezeichneroperator, die die Spezifität des Stils und sorgt erhöht es gilt nur für Elemente innerhalb der Vorlage dieser bestimmten Komponente.
Einer der Hauptvorteile dieses Mechanismus ist, dass die Reihenfolge, in der die Komponentenstile verarbeitet werden, nicht kritisch ist, da die eindeutige Kennung sicherstellen wird, dass sie nicht stören.
Hinweis: Es gibt Möglichkeiten, nicht zu tun haben, dass eindeutige ID auf den Stil angewendet, wenn
benötigt
in diesem video Werfen Sie einen Blick auf mehr Einzelheiten dieses Mechanismus in Aktion zu sehen.
Dank Fahah, ich habe diesen Artikel gelesen, aber es sagt nicht wirklich, in welcher Reihenfolge die Dinge zusammenkommen. Ich versuche nur, in einem Moor-Standard-Angular-Cli-Projekt zu trainieren, wenn ich einige Stile in meiner Hauptsache habe Stil.scss-Datei und einige Komponentenstile in meiner component.scss-Datei, in welche Reihenfolge webpack sie beim Erstellen des Bundles einfügt –