angular-cli how to add global styles?

Question

I created a global style sheet using sass and put it in the public/style/styles.scss. I only specify a background color.

In the index, I added a link to

Answer 1

While I think @filoxo's answer is the documented solution, something like the following works for me as well, and might make it more clear which component needs it:

require('style!../../../node_modules/bootstrap/scss/bootstrap-reboot.scss');

Or when using more recent versions of Angular CLI:

require('style-loader!../../../node_modules/bootstrap/scss/bootstrap-reboot.scss');

Or:

@Component({
    selector: 'my-component',
    styles: [require('style-loader!../../../node_modules/bootstrap/scss/bootstrap-reboot.scss')],
    styleUrls: ['./my.component.scss']
})

The latter might not be allowed; maybe one should not provide both styles and styleUrls, as I'm getting "An object literal cannot have multiple properties with the same name in strict mode" and "Duplicate identifier 'styles'".