Angular8のアプリケーションにbootstrapを導入する

こんにちは!kossyです!



さて、今回はJavaScriptフレームワークの一つであるAngularに、有名なCSSライブラリであるbootstrapを導入する手順を
ブログに残してみたいと思います。




環境
MacOS Mojave
Angular 8.0.6
TypeScript 3.4.5
Rxjs 6.4.0
AngularCLI 8.0.6





npm installしてangular.jsonを書き換えるだけ

ターミナルでAngularのプロジェクトに移動します。
プロジェクトのディレクトリでnpm install bootstrap --saveを実行します

$ cd angular-sample

$ npm install bootstrap --save


あとはangular.jsonを編集するだけです。

"styles": [
              "src/styles.css",
              "node_modules/bootstrap/dist/css/bootstrap.min.css"  // <= この記述を追加
            ],

問題なく起動できるかも試しましょう。

$ ng serve --host 0.0.0.0

これでbootstrapのclassを使えるようになります。