Installed ng-bootstrap CSS in Angular 4 project, but it doesn't seem to be working

I am looking for advice on how to debug this problem. I installed bootstrap like this:

npm install --save bootstrap@4.0.0-alpha.6

then ng-bootstrap like this:

npm install --save @ng-bootstrap/ng-bootstrap bootstrap@4.0.0-alpha.6 font-awesome

I added this to my app.module.ts:

import { NgbModule }      from '@ng-bootstrap/ng-bootstrap';

imports: [
    BrowserModule, 
    FormsModule,
    HttpModule,
    AppRoutingModule,
    NgbModule.forRoot()
  ],

then i added this to my angular-cli.json (i even included the js scrips but this should not be required)

"../node_modules/bootstrap/dist/css/bootstrap.min.css",
"../node_modules/font-awesome/css/font-awesome.min.css",
"../node_modules/jquery/dist/jquery.min.js",
"../node_modules/tether/dist/js/tether.min.js",
"../node_modules/bootstrap/dist/js/bootstrap.min.js"

I can tell that none of this is working since something as simple as this doesn't even show the right result:

<table class="table-striped">
        <tr>
            <th>Firstname</th>
            <th>Lastname</th>
            <th>Age</th>
        </tr>
        <tr>
            <td>Jill</td>
            <td>Smith</td>
            <td>50</td>
        </tr>
        <tr>
            <td>Eve</td>
            <td>Jackson</td>
            <td>94</td>
        </tr>
    </table>

I am using a .Net web API backend with an angular 4 frontend, and I used npm to install all of the angular4, bootstrap, ng-bootstrap, and Font Awesome stuff.

UPDATE: So I seem to have fixed the problem but I am still looking for why this change fixed it. I added these two lines to the sytles.css class:

@import "../node_modules/bootstrap/dist/css/bootstrap.min.css";
@import "../node_modules/font-awesome/css/font-awesome.min.css";

and commented out a few lines from the angular-cli.json so that the file looks like this:

"styles": [
    //"../node_modules/bootstrap/dist/css/bootstrap.min.css",
    //"../node_modules/font-awesome/css/font-awesome.min.css",
    "styles.<%= styleExt %>"
    //"styles.css"
  ],
  "scripts": [
    //"../node_modules/jquery/dist/jquery.min.js",
    //"../node_modules/tether/dist/js/tether.min.js",
    //"../node_modules/bootstrap/dist/js/bootstrap.min.js"
  ],

Can anyone explain why putting the import statements in the styles.css worked, but having references to the same files in the angular-cli.json didn't? the tutorials I was following all showed the references in the angular-cli.json and not the styles.css, so this solution i found seems strange to me...

Here is a screenshot of my project