【发布时间】：2017-12-17 07:21:41
【问题描述】：
我正在寻找有关如何调试此问题的建议。我这样安装引导程序：
npm install --save bootstrap@4.0.0-alpha.6
然后像这样 ng-bootstrap：
npm install --save @ng-bootstrap/ng-bootstrap bootstrap@4.0.0-alpha.6 font-awesome
我将此添加到我的 app.module.ts：
import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
imports: [
BrowserModule,
FormsModule,
HttpModule,
AppRoutingModule,
NgbModule.forRoot()
],
然后我将它添加到我的 angular-cli.json 中（我什至包括了 js 脚本，但这不应该是必需的）
"../node_modules/bootstrap/dist/css/bootstrap.min.css",
"../node_modules/font-awesome/css/font-awesome.min.css",
"../node_modules/jquery/dist/jquery.min.js",
"../node_modules/tether/dist/js/tether.min.js",
"../node_modules/bootstrap/dist/js/bootstrap.min.js"
我可以说这些都不起作用，因为像这样简单的事情甚至没有显示正确的结果：
<table class="table-striped">
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Age</th>
</tr>
<tr>
<td>Jill</td>
<td>Smith</td>
<td>50</td>
</tr>
<tr>
<td>Eve</td>
<td>Jackson</td>
<td>94</td>
</tr>
</table>
我正在使用带有 angular 4 前端的 .Net Web API 后端，我使用 npm 安装了所有 angular4、bootstrap、ng-bootstrap 和 Font Awesome 的东西。
更新： 所以我似乎已经解决了这个问题，但我仍在寻找为什么这个改变解决了它。我将这两行添加到 sytles.css 类中：
@import "../node_modules/bootstrap/dist/css/bootstrap.min.css";
@import "../node_modules/font-awesome/css/font-awesome.min.css";
并从 angular-cli.json 中注释掉几行，使文件看起来像这样：
"styles": [
//"../node_modules/bootstrap/dist/css/bootstrap.min.css",
//"../node_modules/font-awesome/css/font-awesome.min.css",
"styles.<%= styleExt %>"
//"styles.css"
],
"scripts": [
//"../node_modules/jquery/dist/jquery.min.js",
//"../node_modules/tether/dist/js/tether.min.js",
//"../node_modules/bootstrap/dist/js/bootstrap.min.js"
],
谁能解释为什么将 import 语句放在 styles.css 中有效，但在 angular-cli.json 中引用相同的文件却没有？我关注的教程都显示了 angular-cli.json 而不是 styles.css 中的引用，所以我发现的这个解决方案对我来说似乎很奇怪......
【问题讨论】：
-
如果没有@import 语句，您是否在浏览器的开发控制台中遇到任何错误？如果是，它们是什么？
-
@peinearydevelopment 不，事实上，当我注释掉整个 angular-cli.json 文件时，我没有收到任何错误，一切正常。这几乎就像 angular-cli.json 没有被查看。
-
我的猜测是更新 angular-cli.json 文件后，你没有运行
npm run build。如果你这样做了，那么你应该能够打开你的 dist/styles.bundle.js 文件并看到对 bootstrap/dist/css/bootstrap.min.css 的引用。如果你没有，那么导入是通过css imports 进行的，与角度无关。 -
@peinearydevelopment 该项目没有 src 目录。对此有何建议？
-
用您的目录结构或屏幕截图更新您的问题。我多次说过，您需要提供更多信息。
标签： css twitter-bootstrap angular bootstrap-4 ng-bootstrap