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"
Related
I have all the correct packages installed and have SASS running. Now I just need to figure out how to start a project with it. Are there any pre-built templates that show you the file structure, etc...Any help would be great!
An easy way would be to install Compass (http://compass-style.org/) and then it's a simple as running:
compass create project-name
Which would create the structure for you.
And then to compile
compass watch
More can be seen here http://thesassway.com/beginner/getting-started-with-sass-and-compass
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';
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.
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
I wanted to use SASS on our company's web app but I can't install any programs on production machines. Everything I searched about SASS required you to run an installation program like gem and also required HAML.
I was hoping to find just a script that processes scss files without needing to install anything else.
Well... if you have Ruby available, you could checkout the Git repository of Sass (https://github.com/nex3/sass). Do so by either typing git clone https://github.com/nex3/sass.git or just downloading it.
Then you could use the interactive Ruby console by typing irb. Try to require 'sass/lib/sass' (this one here) and run Sass.compile_file 'my_styles.css'.
Otherwise... why are you trying to do that? You can also install sass locally, run sass --watch on your sass folder and it compiles your scss files automatically into css files - which you can deploy on your production environment.
If you can run java program in your build system, you could use JRuby for compiling sass. See this answer for more details
Here's a solution for using Sass without using the command line or installing dependencies. It works with Windows, OS X, and Linux. It has a graphical interface, and no installer, just unzip and double-click.
http://scout-app.io
You can also use the java library https://github.com/scireum/server-sass which can be embedded into any java based web-app. It will compile sass on the fly and return the resulting css. This is especially useful if the Sass sources change (i.e. for customizing reasons) and an ahead of time compilation is not possible. (Note: I'm the author of the project - and it is also not yet a complete implementation of the Sass standard).
Alternatively, what you could do is:
Install Ruby
Download the Sass Gem
Navigate to download location
Run: gem install sass-3.3.4.gem
Voila! Sass is installed.
Use the online Sass compiler SassMeister. You just have to paste your sass code on the left panel and get the css code on the right.