Trying to install foundation using compass - ruby

I get the following error when trying to get my project up on my mac.
LoadError on line 31 of /System/Library/Frameworks/Ruby.framework/Versions/1.8/usr/lib/ruby/1.8/rubygems/custom_require.rb: no such file to load -- zurb-foundation
Note I have updated my gems, updated compass to the latest version, updated the foundation gem but I cannot get my stuff to compile. Also I tried creating a new project with the same settings but i get the same error.

What does your include look like? The library itself is just called foundation. On all my projects I include the path to my vendor files (usually bower_components) in my importPaths configuration, and include this in my main sass file:
#import 'foundation';

Related

Trying to get Sass and Bundler to work cross team?

I created a project that is working and compiling sass as expected. My setup is just using sass, compass, & susy with Netbeans. I had another team member pull it from source control and he is unable to compile with the error:
Syntax error: File to import not found or unreadable: susy.
Load paths:
C:/wamp/www/77864nl2014/wp-content/themes/nl (DEPRECATED)
C:/wamp/www/77864nl2014/wp-content/themes/nl/sass
C:/Program Files (x86)/Prepros/gems/gems/bourbon-3.1.8/app/assets/stylesheets
C:/Program Files (x86)/Prepros/gems/gems/neat-1.4.0/app/assets/stylesheets
C:/wamp/www/77864nl2014/wp-content/themes/nl/sass
C:/Ruby200-x64/lib/ruby/gems/2.0.0/gems/compass-core-1.0.0.alpha.19/stylesheets
Compass::SpriteImporter
on line 2 of C:\wamp\www\77864nl2014\wp-content\themes\nl\sass\main.scss
Use --trace for backtrace.
He is using prepros and has a watch setup on the projects sass directory. He says that prepros is setup with the compass option and configured to use ruby. He has also already installed bundler.
The project config.rb looks like this:
http_path = '/'
css_dir = '/wp-content/themes/nl/styles'
sass_dir = '/wp-content/themes/nl/sass'
images_dir = '/wp-content/themes/nl/images'
javascripts_dir = '/wp-content/themes/nl/scripts'
require 'bundler/setup'
require 'susy'
The Gemfile looks like:
source 'https://rubygems.org'
gem 'sass', '3.3.4'
gem 'compass','1.0.0.alpha.19'
gem 'susy','1.0.9'
I'm not sure what's going on exactly but have several things to try, but hope asking here could expedite the process. We have numerous developers in my office using PCs and Macs, with various IDEs and I was hoping bundler could help solve some issues we have been having. I want to be able to set the specific gems and versions used for a project and commit that with the rest of the project in source control. If another developer needs to work on that project I was hoping bundler would use or pull down the proper gems for the project and the developer would be off and running without having to update configs, gems, etc. Is this how bundler can work once we figure this out? If not is there another better solution for our situation and goals?
The key was to prepend your "compass watch" with "bundle exec". So in command prompt, start your watch using "bundle exec compass watch" on the project directory.

A way to prevent compilation of SCSS/SASS files without appending _ to their name?

I'm using Foundation 4 standalone as a read-only git submodule in a project, and need combine all of its scss files into an umbrella project.scss file, which then gets compiled to project.css.
I'm using Compass to compile, however it compiles any scss file not appended with underscore, so both foundation/scss/normalize.scss and foundation/scss/foundation.scss get compiled twice each - once each standalone, and also into my project.scss file that imports both.
Is there any way to prevent compilation besides appending an underscore to normalize.scss and foundation.scss? I'd rather not append the underscore b/c I want to use the Foundation standalone project exactly as is from the official repo, and simply import it into the project-specific project.scss where all the customizations reside.
Edit: More explanation - I'm using a Scala framework managed by SBT, which makes a system call to Compass compile via an SBT plugin. Compass compile still reads config.rb in my project root for source and target dirs, but I'm not sure what/if other Compass tricks are available in this setup.
I was rather hoping for some kind of syntax trick in config.rb or a Compass command line flag that could tell it to, say, compile all .scss files in [project root]/sass, but not recursively, eg, don't compile anything in [project root]/sass/foundation or other subdirectories. Anyone know anything like that?
The solution is simple: do not include Foundation files into your project.
Instead, install it as a Compass extension and require it from your Compass config.
Note that installing via Gemfile (bundler) is preferred over installing manually with gem install.

Zurb Foundation - How to change project template?

Everytime I build a project I have to move the directories around. We also use Require.js, so I also have to copy and paste from a previous project the javascript initialization file that imports all of the foundation functionality.
I create these projects using either Webstorm 5's Foundation project template or via the command line using:
compass create my_project -r zurb-foundation --using foundation
Where would I go to modify these project templates? Is this down in some ruby path? Is there a project manifest file or something?
Thanks,
Scott
you can get the location of your gem installs from GEM_HOME
echo $GEM_HOME
in my case I get something like this:
/Users/myusername/.rvm/gems/ruby-1.9.3-p286
then in the gems directory you may see several instances of foundation. in my case an `ls' reveals the following directories:
zurb-foundation-3.2.1
zurb-foundation-3.2.2
zurb-foundation-3.2.5
zurb-foundation-4.0.2
zurb-foundation-4.0.3
if you are going to use compass create my_project -r zurb-foundation --using foundation it will pull from the latest version, in my case 4.0.3.
If you want to edit the compass blueprint directly, it is in:
zurb-foundation-4.0.3/templates/project
by modifying these files it will do as you intend, however, if you ever run gem update it is possible it will pull down a new version of foundation and start using that instead.
You might want to consider creating a fork of the foundation project, make the changes you need, and use bundle to create your compass projects. You could easily even create a script to do that.
Check it out on the Zurb Foundation 4 Documentation Page for Sass, under "Creating a project from Git"

Syntax error: File to import not found or unreadable: foundation/common/ratios

I have foundation installed and when I edit and save the app.scss file it creates a "app.css" and a "config.rb" file in the sass folder of my project. when I open that "app.css" file I get this
Syntax error: File to import not found or unreadable: foundation/common/ratios.
and then under that I get this:
File to import not found or unreadable: foundation/common/ratios.
Load paths:
/Applications/MAMP/htdocs/WebApp02/sass
/Library/Ruby/Gems/1.8/gems/compass-0.12.2/frameworks/blueprint/stylesheets
/Library/Ruby/Gems/1.8/gems/compass-0.12.2/frameworks/compass/stylesheets
Compass::SpriteImporter
on line 1 of /Applications/MAMP/htdocs/WebApp02/sass/_settings.scss
from line 2 of /Applications/MAMP/htdocs/WebApp02/sass/app.scss
and then a bunch of paths to my gems.
It never created an app.css and config.rb file in my sass folder before I was wondering if anyone can explain why that is happening. Compass still complies to app.css in the "stylesheet" folder but I would like to fix this to keep from any future errors from happening.
config.rb file looks like this
require 'zurb-foundation'
Require any additional compass plugins here.
Set this to the root of your project when deployed:
http_path = "/"
css_dir = "stylesheets"
sass_dir = "sass"
images_dir = "images"
javascripts_dir = "javascripts"
You can select your preferred output style here (can be overridden via the command line):
output_style = :expanded or :nested or :compact or :compressed
To enable relative paths to assets via compass helper functions. Uncomment:
relative_assets = true
I was having same error in my project with sinatra. It was after upgrading from foundation 3.2.5 to version 4.0.2.
I realized that 'foundation/common/ratios' is not in the zurb-foundation gem anymore.
I had another error on "foundation not found or unreadable" so I had to modify also my Gemfile requiring 'compass' gem before zurb-foundation
gem 'compass'
gem 'zurb-foundation'
With foundation 3.2.5 'compass' wasn't explicitly required in Gemfile, but now it is and if you look at the zurb-foundation.rb code (in your ruby gemset), you can see:
if defined?(Compass)
Compass::Frameworks.register("foundation",
:stylesheets_directory => File.join(root,"scss"),
:templates_directory => File.join(root,"templates")
)
end
For this reason if in the project compass is not defined before zurb-foundation, zurb-foundation.rb doesn't expand the path including the scss folder.
I hope that my experience of today, may help you.
Best regards,
Roberto
I couldnt get this to work (rails 3.2.12 with asset pipeline and gem "compass-rails" and/or gem "compass") so I just locked onto 3.2.5
gem 'zurb-foundation', "= 3.2.5"
i had these same errors when trying to update a foundation 3 website using visual studio Express 2010. Express does not allow the use of the Mindscape extension tool.
so this is what worked for me a few times now. i basically start with a new webfolder using compass to create the folder. I don't waste my time trying to update because this seems to work for me. And its common to back up before a version update anyway.
from the root folder above your website. (i use the vs default path) so from the command line in rails i cd to this path
> cd C:\Users\georgegargoyle\Documents\Visual Studio 2010\WebSites\
*note if you are ungrading from foundation 3, and you only use ruby for foundation, you very well could have an old version of sass which the new foundation will need. i have not known it to hurt to just uninstall and reinstall sass
which is
> gem uninstall sass
>
> gem install sass
i think if it asks you the version of sass and you do not know
type the 5th option as text not the number 5 ... all versions ??
then.. type the number 5
you may get two warnings so i just hit y or yes twice.
anyway, from the websites folder type
compass create yournewfolder -r zurb-foundation --using foundation
you should see cool Woot! there it is then
> cd yournewfolder
to move into the project folder then
gem install compass
gem update compass
gem install foundation
gem update foundation
the documentation for foundation is below and i am new to this so this is not necessarily best practice, just what worked for me. Thanks to gekorob above I think i learned, which i suspected, that the order you run these commands matters because of the versions you have installed. ruby, compass, sass, foundation and visual studio.
Which i suspect can lead to problems if thinks get switched around . and would lead you here.
http://foundation.zurb.com/docs/sass.html
hope this helps and that you see lots of this.
http://www.ipaad.org/images/Step105.jpg

Installing ruby gem less-rails on windows machine using therubyracer

since a while I am trying to install the less-rails gem on my windows7 machine.
I already managed to install the needed therubyracer.gem using this binary file:
https://github.com/stereobooster/therubyracer/downloads
I also downloaded the v8.dll and put in my ruby/bin directory. So far everything works well, the bundle install is running and the server starting without any problems.
But as soon as I request a page using a less file I get the following error message
undefined method `in_javascript?' for #"<"V8::Error: [object Object]>
My css.file is alomst empty
/*
*= require 'custom_less/custom'
*= require 'jquery-ui-1.8.24.custom'
*/
The custom.css.less looks like this
#import "twitter/bootstrap/reset";
#import "twitter/bootstrap/variables";
#import "custom_less/variables"; // Your own variable overrides.
#import "twitter/bootstrap/mixins";
#import "custom_less/mixins"; // Your own mixin.
#import "twitter/bootstrap/scaffolding";
#import "twitter/bootstrap/grid";
#import "twitter/bootstrap/layouts";
//import of further bootstrap components
//but nothing else
I am using the rails installer with ruby 1.9.3.
There are not many problem description like this. All I found was solved by updating to at least ruby 1.9.2. But that unfortunately is not the solution for me. Does somebody have an idea?
Thanks
Download this file: https://github.com/hiranpeiris/therubyracer_for_windows/archive/master.zip
Extract it to a folder and cd to that folder.
Install the gem file in that folder by gem install therubyracer*
The folder has 2 dll files. Copy them to your ruby/bin folder.
Add this to your Gemfile: `gem 'therubyracer'
bundle install
Have fun.
After a lot of research and trial and error it seems that less is not working on the windows plattform at the moment.
So my solution is to use the bootstrap-sass-rails gem instead. This is working pretty well.

Resources