Bootstrap glyphicons aren't appearing when using Rails 5 and bootstrap-sass gem

Question

Glyphicons from bootstrap aren't showing up on my site. I went to check the Network tab in chrome dev tools and saw requests like this for the fonts:

Request URL:http://localhost:3000/fonts/bootstrap/glyphicons-halflings-regular.woff2
Request Method:GET
Status Code:404 Not Found

So I grab the glyphicon fonts and place them in app/assets/fonts/bootstrap , but that doesn't work. I moved the fonts/ folder to public/ and tried again. Glyphicons worked, but this just seems like bad practice.

How do I keep the fonts in app/assets/fonts and get them to load right?

Answer 1

As I was writing the question, I figured it out.

In your bootstrap theme file, look for these lines:

//== Iconography
//
//## Specify custom location and filename of the included Glyphicons icon font. Useful for those including Bootstrap via Bower.

//** Load fonts from this directory.

// [converter] If $bootstrap-sass-asset-helper if used, provide path relative to the assets load path.
// [converter] This is because some asset helpers, such as Sprockets, do not work with file-relative paths.
$icon-font-path: if($bootstrap-sass-asset-helper, "bootstrap/", "../fonts/bootstrap/");

I changed the variable $icon-font-path so it looks like this:

$icon-font-path: if($bootstrap-sass-asset-helper, "bootstrap/", "../assets/fonts/bootstrap/");

Note: all the glyphicon font files are present in app/assets/fonts/bootstrap

Answer 2

我建议您使用： font-awesome-sass