Bootstrap在Angular 6应用程序中不起作用

Question

我想在Angular 6应用程序中使用Bootstrap,这是我到目前为止所做的,但似乎没有任何工作:

1)使用npm安装bootstrap,jquery和popper.js.2)在Angular.json文件中输入以下内容

"styles": [
    "src/styles.scss",
    "node_modules/bootstrap/scss/bootstrap.scss"
],
"scripts": [
    "node_modules/jquery/dist/jquery.slim.min.js",
    "node_modules/popper.js/dist/umd/popper.min.js",
    "node_modules/bootstrap/dist/js/bootstrap.min.js"
    ...
]

我错过了什么.这似乎没有成功.

Answer 1

在你的style.scss文件中使用import

@import "node_modules/bootstrap/scss/bootstrap.scss"

并"node_modules/bootstrap/scss/bootstrap.scss"从angular.json文件中删除

Answer 2

首先将引导程序安装到应用程序：

npm install bootstrap@latest --save (flag is optional)

然后将 bootstrap 导入到 Angular 中的 index.html 文件中：

@import '~bootstrap/css/bootstrap.css'; (~ means the node_Modules)

我希望这回答了你的问题。