[英]Rails Bootstrap glyphicons
所以我在讓bootstraps glyphicons
工作時遇到了很多問題。 我終於能夠讓他們在現場展示。 我現在遇到的唯一問題是我的 DOM 中出現以下錯誤:
GET http://localhost:3000/fonts/glyphicons-halflings-regular.woff2 jquery.self-660adc5….js?body=1:3734
GET http://localhost:3000/fonts/glyphicons-halflings-regular.woff localhost/:1
GET http://localhost:3000/fonts/glyphicons-halflings-regular.ttf 404 (Not Found) localhost/:1
只是讓每個人都知道,當我選擇jquery.self-660adc5...js?body=1:3734
我會看到以下代碼行: support.inlineBlockNeedsLayout = val = div.offsetWidth === 3;
在我的終端中,我得到以下信息:
Started GET "/fonts/glyphicons-halflings-regular.woff2" for ::1 at 2016-04-18 21:57:17 -0600
ActionController::RoutingError (No route matches [GET] "/fonts/glyphicons-halflings-regular.woff2")
我目前在vendor/assets/fonts/
擁有所有引導程序字形文件
glyphicons-halflings-regular.eot glyphicons-halflings-regular.woff
glyphicons-halflings-regular.svg glyphicons-halflings-regular.woff2
glyphicons-halflings-regular.ttf
在我的application.css
文件夾中,我有:
@import "bootstrap-sprockets";
@import "bootstrap";
@font-face {
font-family: 'Glyphicons Halflings';
src: url('../assets/glyphicons-halflings-regular.eot');
src: url('../assets/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('../assets/glyphicons-halflings-regular.woff') format('woff'), url('../assets/glyphicons-halflings-regular.ttf') format('truetype'), url('../assets/glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg');
}
在application.rb
config.assets.paths << "#{Rails}/vendor/assets/fonts"
config.assets.precompile += %w(.svg .eot .woff .ttf .woff2)
在mime_types.rb
Rack::Mime::MIME_TYPES['.woff'] = 'application/x-font-woff'
我想我感到困惑的地方是glyphicons
正在顯示並正常工作,但是,我仍然在 DOM 以及我的終端中遇到錯誤,無法找到這些文件。 關於我如何處理這個的任何建議? 我最初安裝了gem 'bootstrap-sass', '3.2.0.0'
但最終只是將引導程序包放入我的項目中。
不幸的是,我還沒有解決這個問題。 現在我已經包含了 Bootstrap CDN 密鑰:
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<!-- Latest compiled JavaScript -->
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
這顯然暫時消除了錯誤。 如果其他人有任何解決方案或需要有關如何解決此問題的更多信息,請發表評論。 我將非常渴望聽到您的想法。
您仍然需要將woff2
文件添加到資產管道中:
config.assets.precompile += %w(.svg .eot .woff .woff2 .ttf)
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.