3

Yesterday I decided to give Foundation a try on one of my web apps. Everything worked fine as I was in localhost, but when I pushed the new changes to my EC2 instance, continuing to follow the Zurb Foundation instructions, I ran into this error:

Sass::SyntaxError in Home#index

Showing /var/www/brain_db/app/views/layouts/application.html.erb where line #18 raised:

File to import not found or unreadable: foundation/foundation-global. Load path: Sass::Rails::Importer(/var/www/brain_db/app/assets/stylesheets/foundation_and_overrides.scss) (in /var/www/brain_db/app/assets/stylesheets/foundation_and_overrides.scss)

As a newbie to Ruby on Rails and Foundation I'm really unsure of how to resolve this problem. I found many people with similar problems through a Google search, but their situations were slightly different which makes this hard for me to diagnose. Any advice?

6 Answers 6

10

I was getting this same error, and it turned out that I just needed to restart my local development server.

0
6

This is a result of running rails g foundation:install with a different version of foundation than the one you have installed. foundation-global is no longer imported as part of foundation_and_overrides.scss.

Make sure you have the latest version and re-run rails g foundation:install. Just be careful when it offers to overwrite your application layout file - if you had modified that file. Keep the old file somewhere and merge the changes.

1
  • Thanks for this, this was exactly my problem. I had to rvm system and sudo gem install zurb-foundation to get up to speed before running the foundation:install again.
    – Nate Beaty
    Sep 18, 2013 at 17:52
1

If you are using sass then have you renamed your application.css to applications.scss and have you imported the file @import "foundation"; and one more point if you are using the gem 'zurb-foundation', '~> 4.0.0' then you have to place it under assets like this

group :assets do
  gem 'sass-rails',   '~> 3.2.3'
  gem 'coffee-rails', '~> 3.2.1'
  gem 'uglifier', '>= 1.0.3'
  # Add Foundation Here
  gem 'zurb-foundation', '~> 4.0.0'
end
1

I also had this problem with Foundation + Bower + CodeKit.
I fixed it by replacing the following relative paths in app.scss:

BEFORE:
@import "_settings";
@import "foundation";

AFTER:
@import "_settings";
@import "../bower_components/foundation/scss/foundation";`    

And also replace this in settings.scss

BEFORE:
@import 'foundation/functions';

AFTER:
@import "../bower_components/foundation/scss/foundation/_functions";
0

Something is the matter with your zurb-foundation gem installation. There is supposed to be a file called _foundation_global.scss in the gem's directory which contains all the default global variables. You'll get this error if that file is missing.

Reinstalling the gem should fix you right up, in your app's directory run:

gem uninstall zurb-foundation
bundle install

If that fails, manually installing the Gem (gem install zurb-foundation) might work as well.

3
  • Lame :/ What's the output of gem which zurb-foundation and find `gem environment gemdir` -name _foundation-global.scss in your terminal? May 30, 2013 at 16:22
  • For the first: /home/ubuntu/.rvm/gems/ruby-1.9.3-p429/gems/zurb-foundation-4.1.6/lib/zurb-foundation.rb May 31, 2013 at 6:01
  • When I try "gem uninstall zurb-foundation" it says I'm using both 4.0.9 and 4.1.6. Does that have anything to do with it? May 31, 2013 at 6:05
0

I experienced this problem today when updating zurb-foundation to version 4. It may be that your EC2 instance has a later version of Foundation installed. If so, I recommend updating your local development environment. My experience doing this might help ...

It seems that the @import 'foundation/foundation_global'; at the head of the foundation_and_overrides.scss, is no longer required. Instead, a single @import 'foundation'; at the foot of the same file is required.

Also, I had to change my application.js file to include only the lines (relevant to foundation);

//= require foundation

$(function(){ $(document).foundation(); });

I had tried to re-run the Foundation generator that is recommended here but it seems to assumes that it is working on a new project and simply appends the new JavaScript method, as opposed to replacing the previous.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.