Loading javascript libraries and css in a typescript angular 2 webpack project

I've gone through the substantial effort of setting up an angular 2 project with webpack using npm to store local libraries. I have the app working but I am at a loss for how to load things like jquery, d3 or bootstrap that I need for my project.

I used

npm install jquery d3 bootstrap 

etc to install the libraries locally but putting them in my vendor file doesn't do much and I cant access the d3 object or css tags from bootstrap inside my angular 2 templates.

my vendor.ts file has these inside them

import 'jquery';
import 'bootstrap-loader';

I have also tried putting

import * as d3 from 'd3/index';

in my component file but still dont have access to anything from my angular code.

So basically the question how do you load libraries to the browser with angular2 and webpack?

Edit: My loaders ->

       {
            test: /\.css$/,
            include: helpers.root('src', 'app'),
            loader: 'raw'
        },
        {
            test: /\.scss$/,
            loaders: ['style', 'css', 'postcss', 'sass']
        },
        {
            test: /\.(woff2?|ttf|eot|svg)$/,
            loader: 'url?limit=10000'
        },
        {
            test: /bootstrap\/dist\/js\/umd\//,
            loader: 'imports?jQuery=jquery'
        }