Angular CLI: Laden SCSS als separate Dateien in Browser

ich scss Datei bin auch wie unten angegeben:Angular CLI: Laden SCSS als separate Dateien in Browser

import { Component, OnInit, ViewEncapsulation } from '@angular/core'; 

@Component({ 
    ...., 
    styleUrls: ['../../scss/dashboard_admin.scss'], 
    encapsulation: ViewEncapsulation.None 
}) 
export class DashboardAdminComponent implements OnInit { 
.....

Es ist die SCSS-CSS sehr gut zusammenzustellen, aber die Stile in <styles>-Tag geladen, würde Ich mag um sie als separate CSS Datei einzuschließen. Hier

ist die SCSS Zusammenhang config .angular-cli.json

"defaults": { 
    "styleExt": "scss", 
    "component": {} 
}

Quelle

2017-06-11 Vikram

Denn wenn Ihr Projekt nicht verwenden Preprozessoren konfiguriert haben, müssen Sie CSS Dateien in styleUrls kompiliert umfassen, wie folgt aus:

styleUrls: ['path/to/compiled/css/dashboard_admin.css']

Browser können SCSS, SASS, LESS (und so weiter) nicht lesen, geben Sie einfach kompilierte gültige CSS Datei an sie.

Wenn Sie jedoch beispielsweise SASS verwenden möchten, müssen Sie Angular CLI beim Generieren eines neuen Projekts konfigurieren, oder Sie können es für ein vorhandenes Projekt ausführen.

Hier ist die gute Erklärung: https://stackoverflow.com/a/41541042/6053654

Quelle

2017-06-11 13:28:01

Danke, ich auf diese überprüfen. Wie kann ich 'CSS' in einen Ordner übersetzen? Ich benutze Angular CLI. Welche Konfigurationsänderungen muss ich vornehmen? – Vikram

@Vikram, scheint es so, als müssten Sie angular CLI konfigurieren, wenn Sie ein neues Projekt erstellen. Aber wenn Ihr Projekt bereits existiert, können Sie Folgendes tun: https://Stackoverflow.com/a/41541042/6053654 –

@Vikram, und bitte, upvote, wenn meine Antwort für Ihren Fall nützlich ist –

Angular CLI: Laden SCSS als separate Dateien in Browser

Antwort

Verwandte Themen