微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

css – Bootstrap 3 Glyphicons未显示在rails生产服务器上

我无法在我的实时服务器上加载Bootstrap 3 Glyphicons字体,这些字体在我的本地服务器上运行完美但在实时服务器上运行不正常.

我已经尝试过各种各样的东西,从SO到一切,但它仍然不适合我.

这是我在做的事情:

applicatin.css.scss

@import "bootstrap-sprockets";
@import 'home';
@import "bootstrap";

@font-face {
    font-family: 'Glyphicons Halflings';
    src: url("/assets/bootstrap/glyphicons-halflings-regular.eot");
    src: url("/assets/bootstrap/glyphicons-halflings-regular.eot?#iefix") format("embedded-opentype"),url("/assets/bootstrap/glyphicons-halflings-regular.woff2") format("woff2"),url("/assets/bootstrap/glyphicons-halflings-regular.woff") format("woff"),url("/assets/bootstrap/glyphicons-halflings-regular.ttf") format("truetype"),url("/assets/bootstrap/glyphicons-halflings-regular.svg#glyphicons_halflingsregular") format("svg");
}

到目前为止我尝试了什么:

@import "bootstrap-sprockets";
@import 'home';
@import "bootstrap";

@font-face {
    font-family: 'Glyphicons Halflings';
    src: url("/assets/bootstrap/glyphicons-halflings-regular.eot");
    src: url("/assets/bootstrap/glyphicons-halflings-regular.eot?#iefix") format("embedded-opentype"),url("/assets/bootstrap/glyphicons-halflings-regular.svg#glyphicons_halflingsregular") format("svg");
}

@import "bootstrap-sprockets";
@import 'home';
@import "bootstrap";

@import url("http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-glyphicons.css");

@import "bootstrap-sprockets";
@import 'home';
@import "bootstrap";

@import url("//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-glyphicons.css");

@import url("http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-glyphicons.css");
@import "bootstrap-sprockets";
@import 'home';
@import "bootstrap";

@import url("//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-glyphicons.css");
@import "bootstrap-sprockets";
@import 'home';
@import "bootstrap";

但他们都不适合我,但他们在本地服务器上很好.

解决方法

这是资产管道妨碍你的方式……

请按照以下步骤进行修复:

>将字体文件glyphicons-halflings-regular.*复制到文件夹you-app-path / vendor / assets / fonts
>将文件boostrap.css复制到文件夹you-app-path / vendor / assets / stylesheets
>将复制的文件boostrap.css重命名为boostrap.css.erb
>编辑文件boostrap.css.erb,调整@ font-face变量,如下所示:

@font-face {
  font-family: 'Glyphicons Halflings';
  src: url('<%= asset_path('glyphicons-halflings-regular.eot')%>');
  src: url('<%= asset_path('glyphicons-halflings-regular.eot')%>?#iefix') format('embedded-opentype'),url('<%= asset_path('glyphicons-halflings-regular.woff2')%>') format('woff2'),url('<%= asset_path('glyphicons-halflings-regular.woff')%>') format('woff'),url('<%= asset_path('glyphicons-halflings-regular.ttf')%>') format('truetype'),url('<%= asset_path('glyphicons-halflings-regular.svg')%>#glyphicons_halflingsregular') format('svg');
}

>在文件you-app-path / config / initializers / assets.rb中添加/调整以下行:

Rails.application.config.assets.precompile += %w(*.svg *.eot *.woff *.woff2 *.ttf)

>将此行添加文件you-app-path / app / assets / stylesheets / application.css.scss:

*= require bootstrap

>最后,重启你的rails应用程序,一切都应该工作.

原文地址:https://www.jb51.cc/css/215321.html

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。