无法在 Angular 7 项目中加载 Bootstrap 4.2.1 样式

Question

我使用以下方法将引导程序添加到 Angular 项目中：

npm install --popper.js
npm install --jquery.js
npm install --bootstrap

-

-> 它在angular.json文件中被添加为：

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

并且在package.json中也作为：

"dependencies": {
"bootstrap": "^4.2.1"
}

但是像.btn .btn-primary, .form-group, .form-control这样的引导类不起作用。请帮我解决这个问题。由于我们的项目很复杂，需要更快地加载，请向我建议一个不需要更长加载时间的解决方案。（这意味着在 html 或 css 文件中没有导入/插件）

Answer 1

只需检查 angular.json 您是否添加了这些行。

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

在应用模块中导出引导码

app.module.ts

  exports: [],
  bootstrap: [AppComponent],
  schemas: [NO_ERRORS_SCHEMA, CUSTOM_ELEMENTS_SCHEMA]