angular引用bootstrap_angular 7使用bootstrap

本文概述

如何安装Angular项目的Bootstrap?

在命令提示符处运行以下命令:

npm install --save bootstrap@3 => The @3 is important!

此外,当你使用通过Angular CLI 6创建的项目(通过ng v进行检查)时,将具有angular.json文件而不是.angular-cli.json文件。在该文件中,你仍然需要将Bootstrap添加到styles []数组中,但是路径应为node_modules / bootstrap / dist / css / bootstrap.min.css,而不是../node_modules/bootstrap/dist/css/bootstrap。 min.css。前导../不得包含在内。

在这里,我们使用的是Angular 7.2.3版本。

如何在项目中添加bootstrap.css文件?

展开节点模块(库根文件夹)

转到bootstrap文件夹并展开它。

转到dist文件夹并展开dist。

展开css,你将找到“ bootstrap.css”。展开bootstrap.css,你将看到bootstrap.min.css

打开angular.json文件,然后在样式部分添加bootstrap.min.css。

"styles": [

"node_modules/bootstrap/dist/css/bootstrap.min.css", "src/styles.css"

],

现在已为你的Angular 7项目安装了Bootstrap。你现在可以使用它。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值