How do you add app wide CSS files using the Angular CLI?

Question

I want to add some shard styling to my Angular 2 app, things like fonts and color schemes that will be used every where. In the past I have always done this by adding a tag like this to my index page:

<link rel="stylesheet" href="css/framework.css" />

This doesn't work with whatever the CLI is using to serve the app. I tried manually adding the css files to the dist folder after building, but that doesn't seem to work either.

I also tried adding the css in the anugular-cli-build.js folder like this

module.exports = function(defaults) {
  return new Angular2App(defaults, {
    vendorNpmFiles: [
      'css/*.css'
    ]
  });
};

It still doesn't seem to build the files in the css folder out when I tell it to build.

The style sheet in question is meant to be the base line styles for the entire app and not something I want to have to include in the styleUrl tag.

Answer 1

In the latest ng cli just adding required styles and scripts like below in ".angular-cli.json" will expose it in bundle automatically

"apps":{
 "styles": [
        "../node_modules/ng2f-bootstrap/dist/bootstrap.min.css",
        "styles.css"
      ],
  "scripts": [
        "../node_modules/jquery/dist/jquery.min.js",
        "../node_modules/bootstrap/dist/js/bootstrap.js"
      ],
}