Ist es in Ordnung, eine sehr große CSS-Datei innerhalb von "Styles" in angular2 einzuschließen?

Question

import {Component, ViewEncapsulation} from '@angular/core'; 
import {Router, RouteConfig, ROUTER_DIRECTIVES} from '@angular/router-deprecated'; 

import {Home} from './components/home/home'; 
import {About} from './components/about/about'; 
import {RepoBrowser} from './components/repo-browser/repo-browser'; 

@Component({ 
    selector: 'seed-app', 
    providers: [], 
    pipes: [], 
    directives: [ROUTER_DIRECTIVES], 
    styles: [require('bootstrap.scss')], 
    encapsulation: ViewEncapsulation.None, 
    templateUrl: 'app/seed-app.html', 
}) 
@RouteConfig([ 
    { path: '/home',  component: Home,  name: 'Home', useAsDefault: true }, 
    { path: '/about',  component: About,  name: 'About' }, 
    { path: '/github/...', component: RepoBrowser, name: 'RepoBrowser' }, 
]) 
export class SeedApp { 

    constructor() {} 

} 

Der wichtigste Teil ist

Stile: [require ('bootstrap.scss')],

So Bootstrap (die CSS-Bibliothek) ist ziemlich groß, aber ich will, es benutzen in meiner angular2 app so habe ich die Hauptkomponente Encapsulation von keiner gemacht, so wird es die Stile mit der Seite teilen und dann habe ich bootstrap.scss wie vorgeschlagen enthalten.

Meine Frage ist: ist es in Ordnung, eine so große Zeichenfolge (Tausende von Zeilen) innerhalb der Stile Leistung weise zu haben? ist es besser, Bootstrap in den Kopf der Seite wie eine normale CSS-Datei zu setzen?

Answer 1

Angular2 wird einen Build-Schritt (noch in Bearbeitung AFAIK) zur Verfügung stellen, der eine solche Verarbeitung durchführt, bevor die App an den Browser geliefert wird. Wenn Sie dies verwenden, sollte dies keine Rolle spielen, sonst würde ich versuchen, große CSS-Dateien auf diese Weise zu vermeiden. Selbst wenn es kein Umschreiben gibt, weil Sie überall ViewEncapsulation.None verwenden, analysiert Angular2 möglicherweise immer noch das CSS, das redundant ist.