Angular2 Webpackベースのプロジェクトにブートストラップ3を追加するには

Question

jquery &ブートストラップ用のnpmパッケージをインストールしてから​​にインポートを追加しましたが、まだブラウザにスタイリングスタイリングが表示されていません。

... 
import 'jquery/dist/jquery.js' 

import 'bootstrap/dist/css/bootstrap.css'; 
import 'bootstrap/dist/js/bootstrap.js'; 
... 

私はまたwebpack.common.js内の別のエントリを追加しようとしたが、それはどちらかの助けにはなりませんでした。

entry: { 
    'bootstrap': './node_modules/bootstrap/dist/css/bootstrap.min.css', 
    'polyfills': './src/polyfills.ts', 
    'vendor': './src/vendor.ts', 
    'main': './src/main.browser.ts' 
} 

ご協力いただきありがとうございます。

Answer 1

私は、Webpackエントリポイントにブートストラップファイルの場所を伝える必要があると思います。

entry: { 
    app: './app.ts', 
    vendor: [ 
     'bootstrap/dist/css/bootstrap.css' 
    ] 
} 

Answer 2

利用可能な角種子プロジェクトの1つを使用できます。例えば この1 https://github.com/preboot/angular2-webpack

BSをインストールするには、ちょうど​​

import 'jquery'; 
import 'bootstrap/dist/js/bootstrap'; 
import 'bootstrap/dist/css/bootstrap.min.css'; 

に以下を追加し、wepback.common.js詳細については

plugins:[ 
    ..... 
    ..... , 
    new webpack.ProvidePlugin({ 
     jQuery: 'jquery', 
     $: 'jquery', 
     jquery: 'jquery' 
    }) 
] 

に以下を追加しnpm install jquery bootstrap --save

を実行します次のリンクから4番目のコメントを確認してください： https://github.com/AngularClass/angular2-webpack-starter/issues/696

私のために働いた。私はjqueryが見つかりませんでしたが、それは私の問題を解決した不平を取得するために使用されます。