angular-cli und scss inlined

Ich denke, ich muss etwas sehr einfach hier fehlen.angular-cli und scss inlined

Neuinstallation von eckig-cli, erstellen Sie eine neue Website mit scss. Füllen Sie die Scss in der globalen style.scss und auch einige in einer Komponente scss.

wenn bedient oder gebaut werden diese CSS inline. Sie sind nicht extern enthalten, was ich erwarte oder brauche.

Auch die Komponentenebene SCSS nicht Variablen im globalen style.scss Referenz (dies ist vielleicht ich erwarte etwas anderes)

Aber wie verwende ich SCSS generierte eine externe CSS-Datei für die Lieferung?

danke! Paul

Quelle

2017-04-25 paulinventome

Verwenden Sie Loader wie 'css.loader, style-loader' und' Extract-text-webpack-plugin', da angular-cli intern das Webpack verwendet. – Jai

"styleExt": "css" in Winkel cli.json Suchen und Ersetzen mit "styleExt": "scss" und fügen Sie dann "styles.scss" in "Stile": [] in .angular-cli.json`

wenn Sie wollen Verwenden Sie scss in der Komponentenverwendung wie styleUrls: ['app.component.scss']

erstellen Sie eine variable.scss für globale Variable und importieren Sie in allen anderen scss-Datei.

Quelle

2017-04-25 11:15:46

versuchen dies zu tun:

"server:dev": "ng serve -e dev --port 9000 --progress --watch --open --ec=true",

'--ec = true' Hinzufügen sollte es tun. Andernfalls können Sie Ihre angular-cli-App auswerfen und Ihre webpack-Datei manuell konfigurieren, indem Sie weitere Loader hinzufügen. https://github.com/angular/angular-cli/wiki/eject

Quelle

2017-04-25 14:12:15

Ich werde das geben. Ich habe jedoch bemerkt, dass, wenn die App für die Verteilung gebündelt ist, die Stile anscheinend in separaten Dateien bereitgestellt werden, also nehme ich an, dass dies ein Ergebnis der lokalen Bereitstellung in der Entwicklung ist. Was bedeutet ec? danke! – paulinventome

Ja, prod oder AOT build wird Stile herauslösen. Dasselbe, wenn Sie --ec = true oder --extract-css in dev tun, was es tun wird, ist, dass es Ihre Stile in separate Dateien mit ihren sourceMaps extrahiert. PS. Wir sollen nicht -css in dev extrahieren, es macht den Build veeeery langsam (aber für jetzt ist dies die verfügbare Lösung.) https://github.com/angular/angular-cli/issues/4199 –

- "Das selbe, wenn du --ec = true oder --extract-css in dev tust, wird es deine Styles in separate Dateien mit ihren sourceMaps extrahieren." - Nicht unbedingt. Beachten Sie, dass die Option --extract-css nur die globalen CSS-Stile in Stylesheets extrahiert, nicht die Stile auf Komponentenebene. Was immer Sie im Array 'styles' in' .angular-cli.json' aufgelistet haben, sind die globalen Styles. – Meggg

angular-cli und scss inlined

Antwort

Verwandte Themen