fila fila - 1 year ago 307
CSS Question

Angular 2 - Global CSS file

Is it possible to add a global CSS file to Angular 2?
At the moment I have many different components that have the same button styling - but each of the components have their own CSS file with the styling. This is frustrating for changes.

I read somewhere on Stack Overflow to add:

import { ViewEncapsulation } from '@angular/core'; //add this

selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css'],
encapsulation: ViewEncapsulation.None //add this

So I added the ViewEncapsulation lines in the root component, then added the CSS styling to the root app CSS (app.component.css) and removed the CSS styling from individual component CSS files, and it did not work.

Surely there is a way to add a global CSS file? Do I need to add something to the individual components to make them access the global CSS file?

Answer Source

You can simply import the css in the main html file.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download