Natives Skript/Angular - Wie importiere ich globale Stile?

Question

In einer NativeScript App versuche ich einige globale Stile anzuwenden, die in der App geteilt werden.

Dies ist meine Struktur:

- styles 
- partials 
    - _buttons.scss 
    - _exports.scss 

_buttons.scss:

.flt-btn { 
    border-radius: 35px; 
} 

_exports.scss:

@import '_buttons.scss'; 

app.css:

@import './styles/partials/_exports.scss'; 

Wie Sie die Stile für .flt-btn sollte angewendet werden, sehen können, aber sie sind es nicht.

ich die Klasse in einer Feature-Modul bin mit, die faul geladen, login wie folgt ist:

<Button class="flt-btn" text="A button"></Button> 

Wenn ich die BTN Stile direkt ohne Importe in app.css setzte es funktioniert, aber da dies ein css Datei kann ich nicht scss darin verwenden. Ich bin mir also nicht sicher, ob die Importe jemals funktionieren werden, indem Sie es so machen.

Wie kann ich sicherstellen, dass die Stile aus den Partialimporten applikationsweit angewendet werden?

EDIT:

Ich fand this, die meine eigenen Stile in app.android.css und app.ios.css Dateien erfolgreich importiert. ABER .. Nachdem ich SASS installiert habe und das erledigt ist die App einfach komplett leer wenn ich sie im Emulator starte, sowohl in Android als auch in iOS.

Ich bekomme keine Fehler, nichts. Ist jemand erfolgreich dazu gekommen, dass Sass so funktioniert? Bitte lass mich wissen wie und du wirst belohnt werden.

EDIT 2:

Es sieht aus wie die App läuft, weil ich erfolgreich etwas in der app.component.ts ‚Konstruktor einloggen können, so vermute ich, dass etwas auf der Seite alle Elemente verursacht zu verschwinden mit den neuen Formateinstellungen.

Answer 1

fand ich diese Anleitung: https://docs.nativescript.org/ui/theme#sass-usage

Welche den richtigen Weg ist, um dies zu realisieren. Dies erstellt eine scss/CSS-Datei für Android und iOS sowie eine _app-common.scss Datei, mit der Sie Ihre eigenen benutzerdefinierten Stile importieren können. Dies wird dann auf die android und ios css angewendet werden.

Seltsamerweise funktioniert die Komponente scss ohne Installation von Sass wie oben. Aber nach der Installation von Sass können Sie die scss Datei in der styleUrls Eigenschaft einer Komponente nicht mehr referenzieren, stattdessen sollte sie stattdessen mit der css Datei verlinken.Warum das ist, konnte ich nicht herausfinden, aber ich denke, es ist keine große Sache, da es zumindest funktioniert.

Die Antwort von @tay hua ist nicht korrekt, wie es um die angular-cli statt der nativescript-cli bezieht, also, wenn Sie wie ich und habe auf diese stecken, das ist die Antwort, die Sie bei der Suche werden sollte.