css 不从 .scss 文件中获取 css

Question

不确定我错过了什么......

我确实尝试过在 .scss 文件中使用 css 和 scss 以及不同的组合。我仍然没有看到(在 Inspect Element 中)它正在从 Bootstrap 中获取 css。

是的，我在相应的路径中有引导 css 和 scss 文件。

Angular .json

   "styles": [
      "src/styles.scss",
      "node_modules/bootstrap/scss/bootstrap.scss",
      "node_modules/bootstrap/dist/css/bootstrap.min.css",
      "node_modules/font-awesome/css/font-awesome.min.css"
    ],
    "scripts": [
      "node_modules/jquery/dist/jquery.min.js",
      "node_modules/bootstrap/dist/js/bootstrap.min.js"
    ]

样式.scss

@import '~bootstrap/scss/bootstrap';
@import "~bootstrap/scss/functions";
@import "~bootstrap/scss/variables";
@import "~bootstrap/scss/mixins";
@import "~bootstrap/scss/grid";
@import "~bootstrap/scss/navbar";
@import "~bootstrap/scss/forms";
@import '~bootstrap/scss/bootstrap.scss';

@import "styles-variables.scss";
@import "~@angular/material/prebuilt-themes/indigo-pink.css";
@import "~ng-pick-datetime/assets/style/picker.min.css";

我的其他应用看起来不错

一些信息，如果可以提供任何线索。不确定是不是因为 mat-side-nav

Answer 1

要在您的应用程序中使用Bootstrap 样式，您需要:

1. 首先需要安装Bootstrap:npm install –save bootstrap

2. 您应该在 styles.scss 中添加导入:

   @import "~bootstrap/dist/css/bootstrap.css";
   

3. 在angular.json文件中加入样式声明:

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