Heroku/Zurb Foundation Sass SyntaxError in Rails App

Question

My app is throwing this error when I try to push to Heroku. It looks like the culprit is a rogue !global line in a stylesheet somewhere, but I'm not sure where the source code lives.

rake aborted!
Sass::SyntaxError: Invalid CSS after "...odules, $name) ": expected "}", was "!global;"
   (in /tmp/build_6cf14c02-e49b-44e7-819c-871d5da3cf73/app/assets/stylesheets/framework_and_overrides.css.scss:13)

Would greatly appreciate any help.

Answer 1

Change your foundation-rails gem from 5.4.4.0 to 5.4.3.1 in your gem file

gem 'foundation-rails', '5.4.3.1'

then run

bundle update

This should do it for now tell they fix it :)

Additionally:

As for finding the file "bundle show foundation-rails" use the finder "Go to folder" to the path and find "_function.scss" it is under vendor assets stylesheets foundation _function.scss

Both of my answers could be found in the link by gustavo-beathyate

As for heroku error make sure if your adding any thing to the assets to use

rake assets:precompile RAILS_ENV=production

and then

also when you push use -f

git push -f heroku master

if not only use

git push -f heroku master

Answer 2

Here's a solution:

http://foundation.zurb.com/forum/posts/19222-sass-syntax-error-on-rails

You basically have to open the gem and modify line 13 in _functions.scss , removing the call to !global .

Answer 3

This issue has now been fixed with v5.4.5 of Foundation. See also here for some more background on the issue.

Answer 4

I was getting your exact error after I upgraded to foundation-rails 5.5.0.0. I updated the sass-rails gem per this post: https://stackoverflow.com/a/27807138/1753903 and the error went away.