angularjs – 使用Angular CLI的Web应用程序不显示bootstrap-sas

发布时间：2020-12-17 17:00:29 所属栏目：安全来源：网络整理

导读：我有一个用Angular CLI创建的应用程序,我使用bootstrap-sass来自定义主题.我使用以下版本…… node: 6.9.5os: win32 x64@angular/common: 2.4.8@angular/cli: 1.0.0-rc.0@angular/compiler-cli: 2.4.8bootstrap-sass: 3.3.7 在我的.angular-cli.json中我有 "

我有一个用Angular CLI创建的应用程序,我使用bootstrap-sass来自定义主题.我使用以下版本……

node: 6.9.5
os: win32 x64
@angular/common: 2.4.8
@angular/cli: 1.0.0-rc.0
@angular/compiler-cli: 2.4.8
bootstrap-sass: 3.3.7

在我的.angular-cli.json中我有

"scripts": [
    "../node_modules/jquery/dist/jquery.min.js","../node_modules/bootstrap-sass/assets/javascripts/bootstrap.min.js"
  ]

在我的html文件中,我有

<span class="glyphicon glyphicon-user"></span>

在我的scss文件中,我有

$bootstrap-sass-asset-helper: true;
$icon-font-path: if($bootstrap-sass-asset-helper,"../bootstrap/","../fonts/bootstrap/");
@import "../node_modules/bootstrap-sass/assets/stylesheets/_bootstrap.scss";

运行serve或ng build时没有错误,并且应用程序正常运行且浏览器控制台中没有错误.但是,图标仍然不显示.我最初运行这个应用程序正确显示glyphicons,然后我将核心应用程序代码迁移到一个新的angular-cli应用程序.有什么我想念的吗？

解决方法

这似乎是webpack在angular-cli中为 configured的方式的问题.目前,您可以通过在scss文件中使用以下内容指向引导CDN字体来解决此问题

$bootstrap-sass-asset-helper: false;
$icon-font-path: "https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/fonts/";

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!