why can jruby find require 'susy'
in my compass config.rb, but @import 'susy'
within *.scss files produces the issue:
[java] error Web Content/common/sass/base/foundation_de_DE.scss (Line 9: File to import not found or unreadable: susy.
[java] Load paths:
[java] <removed>/Web Content/common/sass
My existing application wants to start using a responsive design on the front end. However, installing ruby / compass on all the developer's machines, integration environments, performance environments and production would kill the initiative.
per this question, and this simplified tutorial I used our current Ant build.xml to make some targets using jRuby.
gems in a jar trick to so that I don't need to install ruby everywhere: downloaded jruby-complete-1.6.8.jar per latest jruby has relative path issue as of 2013.03.20
java -jar jruby-complete-1.6.8.jar -S gem install -i ./susy susy
jar uf jruby-complete-1.6.8.jar -C susy .
java -jar jruby-complete-1.6.8.jar -S gem list
ant target used during the build process:
<target name="compass.compile">
<java classname="org.jruby.Main" fork="true" failonerror="true" classpathref="jruby.classpath">
<arg line="${basedir}/compile.rb ${basedir} compile ${basedir}"/>
</java>
</target>
ant target used by Eclipse based IDE to 'auto-compile' when a user saves a scss file. Instructions to have Eclipse 'auto-build' scss files (start at step #5)
<target name="compass.dev">
<path id="jruby.classpath">
<fileset dir="../../../release/lib/arch/jruby">
<include name="jruby-complete.jar"/>
</fileset>
</path>
<java classname="org.jruby.Main" fork="true" failonerror="true" classpathref="jruby.classpath">
<arg line="${basedir}/compile.rb ${basedir} compile ${basedir}"/>
</java>
</target>
Finally, here is the 'compile.rb' used by the ant target:
Dir.entries(ARGV[0]).each do |lib|
$LOAD_PATH.unshift "#{ARGV[0]}/#{lib}/lib"
end
require 'rubygems'
require 'compass'
require 'susy'
require 'compass/exec'
exit Compass::Exec::SubCommandUI.new([ARGV[1], ARGV[2], "-q"]).run!
and the config.rb used by compass:
# Require any additional compass plugins here.
# Set this to the root of your project when deployed:
require 'susy'
http_path = "./Web Content/"
css_dir = "./Web Content/common/sass-output-css/"
sass_dir = "./Web Content/common/sass/"
add_import_path "./Web Content/sass"
images_dir = "./Web Content/common/images/"
javascripts_dir = "./Web Content/common/js/widgets"
# To enable relative paths to assets via compass helper functions. Uncomment:
#relative_assets = true
and finally, trying to use susy in an scss file:
@import 'reset';
@import 'utilities';
@import 'baseColorVariables';
@import 'font';
@import 'susy';
$total-columns: 12;
$column-width: 4em;
$gutter-width: 1em;
$grid-padding: 1em;
.magic-container { @include container; }