Compass Not Creating CSS Files - ruby

When I run compass compile, the operation runs successfully, but no CSS files are created in my CSS directory. This is my folder structure:
css
images
src
-config.rb
-screen.scss
-overrides.css
And my config.rb file:
http_path = "./"
css_dir = "../css"
sass_dir = "./"
images_dir = "../images"
javascripts_dir = "../javascripts"
line_comments = false
compass v1.1.0.alpha.3
sass v3.4.22
sass-rails v5.0.4
ruby v2.1.1p76

The problem should be with the directories you've specified for your assets i.e css_dir, sass_dir, images_dir and javascripts_dir
The values for the directories are all relative to the http-path.
With the current value for the css_dir in your code, Compass should be generating the css outside your project folder.
You paths should look more like
http_path = '/'
css_dir = 'css'
sass_dir = 'sass' // I suggest you create a folder for all your sass files
images_dir = 'images'
javascripts_dir = 'javascripts'

Related

Ruby/Compass Sass syntax error

First time user of Compass here, having an issue getting my sass compiler to work. I followed a tutorial online and I'm getting this error:
Error
syntaxError on line ["24"] of C: C:/Users/Casey/Sites/devdesktop/bootstrap-subtheme/themes/less_subtheme/config.rb:1:
syntax error, unexpected tIDENTIFIER, expecting end-of-input
..."/themes/less_subtheme" css_dir = "css" sass_dir = "assets/s...
config.rb file
ruby http_path = "/themes/less_subtheme" css_dir = "css" sass_dir = "assets/sass" images_dir = "assets/images" javascripts_dir = "js" fonts_dir = "bootstrap/fonts/bootstrap" generated_images_dir = "img" http_images_path = http_path + "/" + generated_images_dir http_generated_images_path = http_images_path output_style = (environment == :production) ? :compressed : :expanded
I've rewritten the code I copied to make sure no funny quotes or blank spaces were copied over and I still get the same error.
It is because all of your code is on one line and there is "ruby" appearing at the beginning. Try this
http_path = "/themes/less_subtheme"
css_dir = "css"
sass_dir = "assets/sass"
images_dir = "assets/images"
javascripts_dir = "js"
fonts_dir = "bootstrap/fonts/bootstrap"
generated_images_dir = "img"
http_images_path = http_path + "/" + generated_images_dir
http_generated_images_path = http_images_path
output_style = (environment == :production) ? :compressed : :expanded

Make Compass/Sass compile 2 .css, each with different configs

I want compass to compile 2 different .css files: 1 with
output_style = :nested
and one with
output_style = :compressed
So, filename_nested.css and filename_compressed.css, should be compiled.
I am just using a config.rb
config.rb: This seems to work. I wish i didnt have to spec the scss in Compass.compiler.compile('main.scss', 'main.min.css') I would rather use the 'file' variable, but I have yet to work out how. Also, I have yet to figure out how to get around this deprecated function. code found here
http_path = "/wp-content/themes/Harmony_child/css/"
css_dir = ""
sass_dir = ""
images_dir = "img"
javascripts_dir = "js"
fonts_dir = "fonts"
cache_path = "C:/Temp/sasscache"
output_style = :nested
output_style = :compact
line_comments = true
color_output = false
require 'fileutils'
on_stylesheet_saved do |file|
if file.match('.min') == nil
require 'compass'
Compass.add_configuration(
{
:output_style => :compressed
},
'min' #ADDING A CONFIG REQUIRES A NAME
)
Compass.compiler.compile('main.scss', 'main.min.css')
#Compass.compiler is deprecated. Use Compass.sass_compiler instead.
#Compass.sass_compiler('main.scss', 'main.min.css')
#yabbut, it dont work. the deprecated one does...
end
end

Compass and http_images_path

I'm on compass 0.12.2...I'm trying to use the the config reference http_images_path in the config.rb but it doesn't look like it is using this reference...it still resolves the image to my local directory...am I missing something?
Thanks for any help!!
Config.rb
http_path = "/"
# Get the directory that this configuration file exists in
dir = File.dirname(__FILE__)
# Compass configurations
sass_path = dir
css_path = File.join(dir, "..", "css")
#images_dir = "../resources/images"
http_images_path = "http://myurl/img/"
output_style = :expanded
environment = :development
css file:
#import "compass";
.dir
{
background: image-url("guide.jpg");
}
If you are on compass watch...you need to restart to have updated config.rb take effect.

error on compass watch

Below is the error that I get on executing compass watch -
LoadError on line ["36"] of /home/murtaza/.rvm/rubies/ruby-1.9.3-p194/lib/ruby/site_ruby/1.9.1/rubygems/custom_require.rb: cannot load such file -- ceaser-easing
How do I remedy it?
It was due to plugins that had to be installed.
Adding the content as requested -
# Require any additional compass plugins here.
require "ceaser-easing"
require "grid-coordinates"
require "compass_twitter_bootstrap"
# Set this to the root of your project when deployed:
http_path = "/"
css_dir = "css"
sass_dir = "templ/sass"
images_dir = "images"
javascripts_dir = "js"
# 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
# To disable debugging comments that display the original location of your selectors. Uncomment:
# line_comments = false
preferred_syntax = :sass

SASS sprite not working with #extend

Hi I'm messing around with SASS and sprites, and it works fine. It generates a lot of clases from the filenames of my images, which I can use in my markup.
But I would like to use the sprite without changing markup.
This is what I have
my images are located under images/raw
one of the images is called spr-links.png
in my css I have
#import "raw/*.png"; //Sprite
I should be able to to like this, but nothing comes out. SASS does not even fail on this
.footer{
#extend .raw-spr-link;
}
Just uncomment "relative_assets = true"
# Require any additional compass plugins here.
# Set this to the root of your project when deployed:
http_path = "/"
css_dir = "css"
sass_dir = "sass"
images_dir = "images"
javascripts_dir = "js"
relative_assets = true
output_style = :expanded # by Compass.app
sass_options = {:debug_info=>false} # by Compass.app
line_comments = true # by Compass.app

Resources