NativeScript Angular nicht CSS-Dateien findet

Question

Ich bin nur mit NativeScript begonnen, und arbeite durch das Tutorial: https://docs.nativescript.org/angular/tutorial/ng-chapter-3

NativeScript nicht CSS-Dateien im selben Verzeichnis wie meine Komponente, auch finden, wenn die Angabe die Modul-ID.

// login.component.ts 

@Component({ 
    moduleId: module.id, 
    styleUrls: [ 
    './login-common.css', 
    './login.android.css', 
    ], 
    templateUrl: './login.html', 
}) 
export class LoginComponent implements OnDestroy { ... } 

Meine Verzeichnisstruktur ist:

/app 
    /pages 
    /login 
     login.android.css 
     login-common.css 
     login.component.ts 
     login.html 

ich die Benutzerdaten aus dem Emulator abgewischt haben, gestoppt/Neustart der App, die Dateien Namen Quadruple-Option aktiviert ist, aber ich habe immer noch:

Refreshing Anwendung ... JS: ns-Renderer: ERROR Bootstrapping WINKEL JS: ns-Renderer: Die Datei /data/data/org.nativescript.Groceries/files/app/pages/login/.login.android .css existiert nicht. Gelöst von: /data/data/org.nativescript.Groceries/files/app/pages/login/.login.android.css.

Ich habe versucht, auch nicht unter Angabe der moduleId Wert und verwendet Pfade in Bezug auf /app und ich die gleichen Fehler zu bekommen. Keine anderen Komponenten verwenden diese Dateien. Was mache ich falsch?

Update:

ich eine andere Komponente gemacht habe und konnte erfolgreich eine bauteil relativ Sheet importieren. Gibt es eine Art Build-Cache, den ich löschen muss?

Answer 1

Wenn die Laufzeitumgebung tns Ihre App erstellt, werden plattformbezogene Dateien neu geschrieben.

Was das bedeutet ist, dass alles .android wird nur die Wurzel .ts/.css/.html Datei werden.

login.android.css wird login.css

Das gleiche gilt für iOS zugehörigen Dateien. Dadurch können Sie nur die generische Datei importieren und die richtigen Dateien für Ihre Laufzeit intelligent herausfiltern.

In Ihrem Beispiel importieren Sie einfach login.css anstelle der zwei aufgeführten Stylesheets. Importieren Sie in Ihrer login-android.css Datei die Datei login-common.css.

EDIT:

In Bezug auf moduleId, würde ich immer, dass Ihre Komponenten Anwendung empfehlen. Es macht die Pfade relativ zum aktuellen Ordner. Also, wenn Sie es hinzufügen, wird es die './ Importe relativ zu Ihrem login Ordner der Komponente machen.