在Angular CLI中使用Bootstrap的最佳方法是什么？

Question

哪一个是在Angular-Cli项目中使用Bootstrap的最佳实践？

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

要么

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

Answer 1

对我来说最好的方法是:

• 用它创建一个项目 ng new
• 使用安装bootstrap,jquery和font-awesome npm install bootstrap@4.0.0-alpha.6 jquery font-awesome

• 在你的.angular-cli.json添加中:

  "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" ]

这将自动编译index.html中bootstrap js所需的bootstrap css和javascript,font-awesome和jquery.

注意:jquery.min.js在包含脚本之前必须包含脚本bootstrap.min.js,因为bootstrap.min.js需要jquery.min.js正常工作.

更新: Bootstrap 4需要tether.js.安装它npm install tether并将其添加到.angular-cli.jsonBEFORE bootstrap.min.js中的脚本中.

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