我正在尝试将Bootstrap添加到我的Angular应用程序中。我是这方面的新手，尽管遵循了所需的步骤，但在安装引导程序时遇到了问题。
-
我完成了安装Angular cli、ng new first应用程序和ng serve的所有必要步骤。
-
我打开vs代码终端，并尝试使用安装引导程序
npm安装引导程序--保存
-
然后将其添加到style.css 中
@import"~bootstrap/dist/css/bootstrap.css">
但当我点击悬停在上面代码段上的链接时，它仍然显示无法定位文件，并提示使用此路径创建文件。
如果您只想从bootstrap添加样式，angular.json文件中有一个属性允许您将其包含在构建中。
{
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
"projects": {
"yourproject": {
"architect": {
"build": {
"options": {
"styles": [
"src/styles.scss",
"node_modules/bootstrap/dist/css/bootstrap.min.css"
]
},
...
请参阅：https://angular.io/guide/workspace-config#styles-和脚本配置
在项目内src文件夹下的style.css文件中添加以下行。
@import '~bootstrap/dist/css/bootstrap.min.css';
欢迎使用StackOverflow！
Bootstrap不是TypeScript代码，因此您不会将其导入。相反，它是CSS代码，因此您希望将其作为`导入index.html文件中
以下是我如何在我的应用程序中导入boostrap——下面是index.html的<head>标签
<link
rel="stylesheet"
href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T"
crossorigin="anonymous"
/>
这样做可以让我在任何代码模板中使用Bootstrap。
顺便说一句，该代码将链接到4.3.1版本——如果你想链接到不同的版本，你可以转到https://getbootstrap.com/并获得一个"新鲜"的链接——该网站在让你使用CDN链接方面非常有帮助。
但我看到你想把它导入到你的styles.css文件中，所以你可能不得不使用一个相对路径，可能类似于：
@import "../node_modules/bootstrap/dist/css/bootstrap.css";
添加引导程序的一个简单方法是使用Angular CLI(npm install(。
从命令行界面安装引导程序并在angular.json 中引用它
npm install bootstrap --save
如果要添加bootstrap@3.x这是程序。
步骤1。安装引导程序。在您的终端中运行此命令。
npm install bootstrap@3.3.7
步骤2。安装Jquery。运行此命令
npm install jquery
步骤3。然后，转到angular.json文件
...
"styles": [
"src/styles.css",
"./node_modules/bootstrap/dist/css/bootstrap.min.css"
],
"scripts": [
"./node_modules/jquery/dist/jquery.min.js",
"./node_modules/bootstrap/dist/js/bootstrap.min.js"
]
...
步骤4。别忘了重新启动你的应用程序。