在Angular CLI中使用Bootstrap的最佳方式

Question

在Angular-Cli項目中使用Bootstrap的最佳做法是哪一種？

使用這種方法： https://medium.com/@beeman/tutorial-add-bootstrap-to-angular-cli-apps-b0a652f2eb2

或者

使用NGX的自舉： https://github.com/valor-software/ngx-bootstrap/blob/development/docs/getting-started/ng-cli.md

Answer 1

對我來說，最好的辦法是：

• 與創建項目ng new
• 安裝靴子在.angular-cli.json附加陷阱，jQuery和字體真棒與npm install bootstrap@4.0.0-alpha.6 jquery font-awesome

• ：

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

這將自動編譯引導CSS和JavaScript，字體真棒和jQuery，這是必需的引導js，在你的index.html中。

注意：在腳本的jquery.min.js必須包含在bootstrap.min.js包括前，因爲bootstrap.min.js需要jquery.min.js正常工作。

更新： Bootstrap 4需要tether.js。使用npm install tether安裝它，並在bootstrap.min.js之前將其添加到.angular-cli.json的腳本中。

"scripts": [ 
     "../node_modules/jquery/dist/jquery.min.js", 
     "../node_modules/tether/dist/js/tether.min.js", 
     "../node_modules/bootstrap/dist/js/bootstrap.min.js"