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
使用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正常运行。< / p>

<强>更新 Bootstrap 4需要tether.js。使用npm install tether安装它并将其添加到.angular-cli.json之前的脚本中，然后再运行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"

Answer 2

在任何有角度的项目中，首选使用ng-bootstrap而不是bootstrap。

以下是来自documentation的评论。

ng-bootstrap的目标是完全替换组件的JavaScript实现。您也不应包括jQuery或popper.js之类的其他依赖项。没必要，并且可能会干扰ng-bootstrap代码。

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

2 个答案: