首页 文章

如何在Angular应用程序中集成Bootstrap CSS

提问于
浏览 次
1

我有两个类似的非常小的Angular应用程序集成了Bootstrap CSS . 一个工作，一个我自己创建的没有 . 目前还不清楚它的区别是什么，为什么它在我的情况下不起作用 .

我的步骤如下：

npm install bootstrap --save

这更新 package.json 然后我更新 index.html 并添加

<link rel="stylesheet" href="../node_modules/bootstrap/dist/css/bootstrap.min.css">

与工作应用程序完全相同但在我使用 ng new new-app 创建的示例应用程序中它不起作用 .

Chrome中的网络选项卡显示404.基本上找不到URL http://localhost:4200/node_modules/bootstrap/dist/css/bootstrap.min.css .

在Angular应用程序中集成Bootstrap CSS的正确/完整方法是什么？

javascript css angular

2 回答

  • 0

    看来你正在使用角度和角度cli

    如果是这种情况那么你可以在 .angular-cli.json 里面的数组中添加bootstrap.css文件，这对应于 style key这样

    "styles": [
        "styles.less",
        "../node_modules/bootstrap/dist/css/bootstrap.min.css"
      ]

    另外两种可能性是使用 @import 在主.css文件中导入 bootstrap.css ，或者您可以在主 index.js 文件中要求它 .

    回复于
  • 3

    由于您使用的是Angular-CLI：

    更新.angular-cli.json文件以包含引导程序样式：

    "styles": [
    "../node_modules/bootstrap/dist/css/bootstrap.min.css",
],

    无需将其包含在index.html中

    回复于

相关问题