CODEWITHSUNDEEP
cssruby-on-railstwitter-bootstrap
Flip
Flip

Reputation: 6781

How to require a specific file in application.css

I am trying to require "font-awesome.scss" in the application.css of my Rails 4 app like this:

/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS and SCSS file within this directory, lib/assets/stylesheets,    vendor/assets/stylesheets,
 * or any plugin's vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any styles
 * defined in the other CSS/SCSS files in this directory. It is generally better to create a new
 * file per style scope.
 *
 *= require 'font-awesome.scss'
 *= require_tree .
 *= require_self
 */

'font-awesome.scss' imports a bunch of files that look like partials, with a preceding underscore. One of these partials (_variables.scss) defines a variable that I need to define as of the moment I get the following error message: 

Sass::SyntaxError (Undefined variable: "$fa-css-prefix".
(in /Users/bla/rails_projects/Homepage/app/assets/stylesheets/_bordered-pulled.scss:4)):
app/assets/stylesheets/_bordered-pulled.scss:4
app/views/layouts/application.html.erb:35:in `_app_views_layouts_application_html_erb__3531690645719711557_70221015865520'

What am I doing wrong?

Upvotes: 3

Views: 1788

Answers (3)

zapcaz
zapcaz

Reputation: 61

Try checking how you are precompiling assets. Check initializers/assets.rb (or it may be environments/production.rb for you) to make sure you are precompiling assets in a friendly way, like this: 

config.assets.precompile += ["*.js", "*.scss", "*.jpg", "*.png"]

I was having this same error when it was 

config.assets.precompile += [/.*\.png/,/.*\.ico/,/.*\.jpg/,/.*\.js/,/.*\.scss/]

Upvotes: 0

neo
neo

Reputation: 4116

you can use font awesome without the gem, just use their cdn.

This goes in your layout, application.html.erb

<head>
...
  <link href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet">
...
</head>

More info here: http://fortawesome.github.io/Font-Awesome/get-started/

Upvotes: 0

NM Pennypacker
NM Pennypacker

Reputation: 6952

Just do this:

*= require font-awesome

No need to put the quotes or extension. More docs on the subject here: http://guides.rubyonrails.org/asset_pipeline.html

Upvotes: 1

Related Questions