Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Rails Engine - File to import not found or unreadable: font-awesome #130

Closed
elrayle opened this issue Feb 5, 2015 · 25 comments
Closed

Rails Engine - File to import not found or unreadable: font-awesome #130

elrayle opened this issue Feb 5, 2015 · 25 comments

Comments

@elrayle
Copy link

elrayle commented Feb 5, 2015

I did a super simple rails app and used font-awesome with no problem. Expanding this to do the same steps in a rails engine produces the following error. I am guessing this will be a simple fix, but I haven't been able to find one.

File to import not found or unreadable: font-awesome

Steps to generate the engine and setup font-awesome...

create the basic engine with one model class for testing

rails plugin new testeng --full --mountable 
cd testeng
bundle install
rails g scaffold book title:string desc:string
rake db:migrate

add in font-awesome

  • edit testeng.gemspec and add sass-rails and font-awesome gems after the rails gem is included
  s.add_dependency 'sass-rails', '~> 4.0.3'
  s.add_dependency 'font-awesome-rails'
  • rename application.css to application.css.scss
cd app/assets/stylesheets/testeng/
mv application.css application.css.scss
  • edit app/assets/stylesheets/testeng/application.css.scss and append import statement at end of file.
@import 'font-awesome';
  • edit app/views/testeng/books/index.html.erb and use some font-awesome icons
<h1>Listing books</h1>

<%= link_to content_tag(:i, '', :class => "fa fa-plus-circle"), new_book_path  %>

start rails server

cd <root-app-path>
bundle install
cd test/dummy
bundle install
rails s

Test in browser

http://localhost:3000/testeng/books

Get ERROR

File to import not found or unreadable: font-awesome
@rmm5t
Copy link
Collaborator

rmm5t commented Feb 9, 2015

Could you please include some more details about the versions of rails and related gems that you're locked to as well?

e.g. The version of sass-rails that you're currently tied to is 1 major version behind, but that might make sense considering the version of rails you're working against.

@elrayle
Copy link
Author

elrayle commented Feb 10, 2015

To make it easier to look at what I am doing, I added the testeng Rails Engine to my repositories.

https://github.com/elrayle/testeng

@rmm5t
Copy link
Collaborator

rmm5t commented Feb 17, 2015

@elrayle Thanks that published project should help, but I've been really swamped lately, and I probably won't have time to investigate this anytime soon. If anyone else has some free cycles to investigate, much appreciation.

In the meantime, @elrayle, if you're able to better debug this yourself and provide a recommended solution here, I'd be happy to review it.

@anitagraham
Copy link

+1 having the same error. (I haven't built the simple test app yet)

I can't see fontawesome anything in the load paths

 CompassRails::SpriteImporter
< 30 duplicate lines removed. >
  CompassRails::SpriteImporter
  /Applications/MAMP/www/caststone3.0/app/assets/fonts
  /Applications/MAMP/www/caststone3.0/app/assets/images
  /Applications/MAMP/www/caststone3.0/app/assets/javascripts
  /Applications/MAMP/www/caststone3.0/app/assets/stylesheets
  /Applications/MAMP/www/caststone3.0/app/assets/templates
  /Applications/MAMP/www/caststone3.0/vendor/assets/javascripts
  /Applications/MAMP/www/caststone3.0/vendor/assets/stylesheets
  /Applications/MAMP/www/refinerycms-videojs/app/assets/images
  /Applications/MAMP/www/refinerycms-videojs/app/assets/javascripts
  /Applications/MAMP/www/refinerycms-videojs/app/assets/stylesheets
  /Applications/MAMP/www/refinerycms-caststone/app/assets/javascripts
  /Applications/MAMP/www/refinerycms-caststone/app/assets/stylesheets
  /Users/anita/.rvm/gems/ruby-2.2.0/bundler/gems/refinerycms-page-resources-18450c6454cd/app/assets/javascripts
  /Users/anita/.rvm/gems/ruby-2.2.0/bundler/gems/refinerycms-page-resources-18450c6454cd/app/assets/stylesheets
  /Applications/MAMP/www/refinerycms-testimonials/app/assets/images
  /Applications/MAMP/www/refinerycms-testimonials/app/assets/javascripts
  /Applications/MAMP/www/refinerycms-testimonials/app/assets/stylesheets
  /Users/anita/.rvm/gems/ruby-2.2.0/bundler/gems/refinerycms-inquiries-c0af1f31a15b/app/assets/stylesheets
  /Users/anita/.rvm/gems/ruby-2.2.0/bundler/gems/refinerycms-page-images-8605922cc458/app/assets/javascripts
  /Users/anita/.rvm/gems/ruby-2.2.0/bundler/gems/refinerycms-page-images-8605922cc458/app/assets/stylesheets
  /Users/anita/.rvm/gems/ruby-2.2.0/gems/refinerycms-wymeditor-1.0.6/app/assets/images
  /Users/anita/.rvm/gems/ruby-2.2.0/gems/refinerycms-wymeditor-1.0.6/app/assets/javascripts
  /Users/anita/.rvm/gems/ruby-2.2.0/gems/refinerycms-wymeditor-1.0.6/app/assets/stylesheets
  /Users/anita/.rvm/gems/ruby-2.2.0/gems/jquery-ui-rails-5.0.3/app/assets/images
  /Users/anita/.rvm/gems/ruby-2.2.0/gems/jquery-ui-rails-5.0.3/app/assets/javascripts
  /Users/anita/.rvm/gems/ruby-2.2.0/gems/jquery-ui-rails-5.0.3/app/assets/stylesheets
  /Users/anita/.rvm/gems/ruby-2.2.0/bundler/gems/refinerycms-fa3f0b60367a/core/app/assets/images
  /Users/anita/.rvm/gems/ruby-2.2.0/bundler/gems/refinerycms-fa3f0b60367a/core/app/assets/javascripts
  /Users/anita/.rvm/gems/ruby-2.2.0/bundler/gems/refinerycms-fa3f0b60367a/core/app/assets/stylesheets
  /Users/anita/.rvm/gems/ruby-2.2.0/bundler/gems/refinerycms-fa3f0b60367a/core/vendor/assets/javascripts
  /Users/anita/.rvm/gems/ruby-2.2.0/gems/refinerycms-i18n-3.0.1/app/assets/images
  /Users/anita/.rvm/gems/ruby-2.2.0/gems/web-console-2.0.0/lib/assets/javascripts
  /Users/anita/.rvm/gems/ruby-2.2.0/gems/turbolinks-2.5.3/lib/assets/javascripts
  /Users/anita/.rvm/gems/ruby-2.2.0/gems/jquery-rails-4.0.3/vendor/assets/javascripts
  /Users/anita/.rvm/gems/ruby-2.2.0/gems/foundation-rails-5.5.1.0/vendor/assets/javascripts
  /Users/anita/.rvm/gems/ruby-2.2.0/gems/foundation-rails-5.5.1.0/vendor/assets/stylesheets
  /Users/anita/.rvm/gems/ruby-2.2.0/gems/coffee-rails-4.1.0/lib/assets/javascripts
  /Applications/MAMP/www/caststone3.0/app/assets/stylesheets
  /Users/anita/.rvm/gems/ruby-2.2.0/gems/compass-core-1.0.3/stylesheets

@anitagraham
Copy link

I seem to have moved on by using @import 'font-awesome.css'
(since there doesn't seem to be a font-awesome.scss)

@elrayle
Copy link
Author

elrayle commented Feb 25, 2015

I tried the @import 'font-awesome.css'. It did indeed get rid of the error File to import not found or unreadable: font-awesome during start-up. I now get an error when I try to use a font-awesome icon: No route matches [GET] "/assets/testeng/font-awesome.css". anitagraham, did you see this issue?

I updated the testeng on github to include

  • instructions in the readme of how to test
  • a clearer marker on the books page of where the font-awesome icon should display
  • change @import to include css extension

@1ternal
Copy link

1ternal commented Apr 13, 2015

After running gem update, I've the same issue.
use @import 'font-awesome.css'solve my problem.

File to import not found or unreadable: font-awesome

here is the changes,is this sprockets related?

-    coffee-script-source (1.9.1.1)
+    coffee-script-source (1.9.1)

-    connection_pool (2.2.0)
+    connection_pool (2.1.3)

-    execjs (2.5.2)
+    execjs (2.5.1)

+    hike (1.2.3)

-    jbuilder (2.2.13)
+    jbuilder (2.2.12)

-    sprockets (3.0.0)
+    sprockets (2.12.3)
+      hike (~> 1.2)
+      multi_json (~> 1.0)
+      tilt (~> 1.1, != 1.3.0)

@rmm5t
Copy link
Collaborator

rmm5t commented Apr 13, 2015

@1ternal Related to #125?

@anitagraham
Copy link

I think I ended up using 'gem font-awesome-sass' instead.

@jrissler
Copy link

+1 still an issue - rails 4.2, fresh engine.

@rmm5t
Copy link
Collaborator

rmm5t commented Apr 22, 2015

I don't personally use font-awesome-rails in any engines, but a pull-request or a pointer to some docs that shows what this gem is missing, and I'd be glad to review it.

@rmm5t
Copy link
Collaborator

rmm5t commented Apr 22, 2015

Nevermind, I did a quick search, and I actually see where things might have gone awry for engine support. I'm investigating a fix now.

@rmm5t
Copy link
Collaborator

rmm5t commented Apr 22, 2015

Okay. For everyone building Rails Engines that depend on font-awesome-rails, I think you just need to make sure that you manually require "font-awesome-rails" somewhere in your engine.

For example, I just submitted a pull-request to @elrayle's test engine:
elrayle/test_engine#1

Here's an article that helps explain why this might be necessary:
https://bibwild.wordpress.com/2013/02/27/gem-depends-on-rails-engine-gem-gotcha-need-explicit-require/

Here's a StackOverflow answer that helps confirm this:
http://stackoverflow.com/a/5850503/8985

I did a quick test myself, and things seemed to work as expected afterwards. If someone could chime in and confirm that this also works for their own engine, I'll go ahead and close out this issue after adding something to the README too.

kevinshieh referenced this issue in calblueprint/calblueprint.org Apr 26, 2015
@kalashnikovisme
Copy link

using @import 'font-awesome.css' in SCSS or SASS has solved problem.

@rmm5t
Copy link
Collaborator

rmm5t commented Jun 5, 2015

Closing this out due to lack of follow-up. The solution I presented above should be the correct approach for including tie gem in rails engines. PRs welcome if there's something that this gem can add to make it even easier.

@rmm5t rmm5t closed this as completed Jun 5, 2015
@ghost
Copy link

ghost commented Aug 21, 2015

got same issues ... not ready for normal gem use w Rails 4.2.3 and Bootstrap 3

@Preen
Copy link

Preen commented Sep 1, 2015

+1

@rmm5t
Copy link
Collaborator

rmm5t commented Sep 4, 2015

@Erwin16 @Preen When building an engine that depends on font-awesome-rails, be sure to follow the instructions in this new README update: https://github.com/bokmann/font-awesome-rails#rails-engines

@coderdave
Copy link

For anyone still coming across this error and not using engines, I had to also upgrade to sass-rails 5.0.4 and bootstrap-sass 3.3.6.

@wenweih
Copy link

wenweih commented Feb 16, 2016

Restart app.

@voltechs
Copy link

@rmm5t And of course you mean require 'font-awesome-sass', not require 'font-awesome-rails'

Requiring this at the top of my engine.rb did the trick (along with all the other dependancies; I'd forgotten)

@rmm5t
Copy link
Collaborator

rmm5t commented Jul 10, 2016

@voltechs No. I meant what I wrote. Your suggestion implies a different project/gem than this one.

@sartorius
Copy link

Hi all,

The @rmm5t point on updating the engine (please follow the stackoverflow link) is correct and solve my issue.
You need to create an engine.rb in your lib/assets directory if it does not exist then you need to add the line require "font-awesome-rails"
and restart your server.

@risinglf
Copy link

For me using require 'sass-rails' in engine.rb has solved problem.

@madisonsites
Copy link

madisonsites commented May 12, 2022

Okay, I seem to be having a problem in my engine despite the remedies y'all have suggested.

Tried this, which gave me this error: undefined method 'fa_icon' for <<Class:0x0000000120a85040>:0x0000000117b6f720>

# show.html.erb

<%= fa_icon "campground" %>

Tried this, which didn't error but also didn't show anything

# show.html.erb

<i class="fa fa-campground"></i>

I went through that (very helpful) stackoverflow solution to check my files....

I already have the gem in my engine's .gemspec

# engines/enginely/enginely.gemspec

  spec.add_dependency "rails", "~> 5.2.6"
  spec.add_dependency "bootstrap"
  spec.add_dependency "jquery-rails"
  spec.add_dependency "font-awesome-rails"

My engine's Gemfile already had the gemspec line in it...

# engines/enginely/Gemfile
gemspec

For my engine.rb, I tried both...

manual requiring...

# engines/enginely/lib/enginely/engine.rb

require 'font-awesome-rails'
require 'bootstrap'
require 'jquery-rails'
require 'sass-rails'
require 'bootstrap-sass'
require 'enginely/engine'

module Enginely
  class Engine < ::Rails::Engine

as well as the neat logic to automatically require

# engines/enginely/lib/enginely/engine.rb

Gem.loaded_specs['trailblazer'].dependencies.each do |d|
  require d.name unless d.type == :development
end

require 'enginely/engine'
module Enginely
  class Engine < ::Rails::Engine

For 💩 and giggles, I also tried adding some new files to see if they would work...

Like an assets initializer...

# engines/enginely/config/initializers/assets.rb

require "bootstrap"
require "jquery-rails"
require "font-awesome-rails"
require "sass-rails"
require "bootstrap-sass"

And an engine file inside my assets...

# engines/enginely/app/assets/engine.rb

require "bootstrap"
require "jquery-rails"
require "font-awesome-rails"
require "sass-rails"
require "bootstrap-sass"

I ran bundle install multiple times throughout this just to be sure - I do see the app in my Gemfile.lock. I re-started my server with every change I made. Surely I'm overlooking something silly here? 🤞 someone is willing to take a look and show me the error of my ways.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests