我是一名后端开发人员,我只是在玩Angular4。所以我做了这个安装教程:
鉴于此,我如何将bootstrap添加到应用程序中,以便我可以使用"container-fluid"或"col-md-6"之类的类?
npm install --save bootstrap
之后,在angular-cli.json里面(在项目的根文件夹里面),找到styles
,像这样添加bootstrap css文件。
"styles": [
"../node_modules/bootstrap/dist/css/bootstrap.min.css",
"styles.css"
],
更新:
在angular 6+中,angular-cli.json
**被改为angular.json
了。
在Angular4中,当你处理@types系统时,你应该做以下事情。
做。
1) npm install --save @types/jquery
2) npm install --save @types/bootstrap
tsconfig.json
寻找types数组并添加jquery和bootstrap条目。
"types": [
"jquery",
"bootstrap",
"node"
]
Index.html
在标题部分添加以下条目。
<link href="node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
<script src="node_modules/jquery/dist/jquery.min.js "></script>
<script src="node_modules/bootstrap/dist/js/bootstrap.js "></script>
并开始使用jquery和bootstrap两者。
在你的项目中运行以下命令,即 npm install [email protected] -save
在安装完上述依赖后,运行以下npm命令,这将安装bootstrap模块 npm install --save @ng-bootstrap/ng-bootstrap
请看这个参考 - https://github.com/ng-bootstrap/ng-bootstrap
在app.module中添加以下导入内容 import {NgbModule} from '@ng-bootstrap/ng-bootstrap'; 并在导入中添加NgbModule
在你的 stye.css 中 @import "./node_modules/bootstrap/dist/css/bootstrap.min.css"。