Is there a way to force Compass to use the Sass syntax instead of SCSS?
For new projects, run:
compass create path/to/project --syntax sass
to generate .sass files using Sass syntax inside the sass folder. The --syntax option and others are listed when you run compass --help.
For existing projects, add the following to your Compass config.rb:
preferred_syntax = :sass
That's covered in the Compass configuration reference. And you'll want to run your existing SCSS files through sass-convert to generate new ones which use Sass syntax.
Related
ColorZilla's gradient editor says
// needs latest Compass, add '#import "compass"' to your scss
Well I've found that's not so easy. Obviously if you just throw #import "compass"; at the top of your .scss file, Sass won't compile because _compass.scss can't be found.
This is an asp.net project utilizing Sass. In addition, I have to use the sass ruby gem to compile, not compass's compiler.
I've installed the compass gem. I've followed the instructions on http://compass-style.org/install/. I've run compass init, compass create, compass install. None of them even give me compass's mixins.
I expected this to work like bourbon, though I know this isn't compass's primary goal.
What am I missing?
Install the library
bower install compass-sass-mixins
Import the compass into your SASS file
#import "bower_components/compass-sass-mixins/lib/compass"
Checkout SASS function list:
https://github.com/askucher/compass-sass-mixins
I'm trying to use SASS but I got some issue with it, is not compiling anything. I tried different things to troubleshoot, is still not working.
Ruby 2.0.0-p576
Sass 3.4.5
Wind 7
sass --watch sass/scss.css:css/style.css
OR
sass --watch scss.css:css.css
result:
sass is watching for change .press Ctr-C to stop.
write sass/scss.css
write sass/scss.css.map
config.rb
# Set this to the root of your project when deployed:
css_dir = 'css'
sass_dir = 'sass'
images_dir = './img'
javascript_dir = 'js'
output_style = :expanded
relative_assets = true
line_comments = false
Thanks
Based on the information you've provided, there are a couple of things to fix.
First, you'll want your .scss files to have the same name as your compiled .css files, just with a different extension. In this case, you'd name your .scss file style.scss, and sass will save the compiled result to style.css.
The second thing I notice is that you're using compass, with a config.rb file. This suggests that you probably don't want to use the sass --watch command to start Sass, since going this route will not actually enable Compass to be used in your Sass files. The way to invoke compass here is to run compass watch from the directory that encloses your /sass and /css directories (since those are specified in your config.rb file.
Fixing those two items will probably get your Sass compiler running the way you want. Here's what the resulting structure should look like:
/enclosing_folder
config.rb
/css
style.css (this will be added by the sass compiler)
/sass
style.scss
In this example, run compass watch from enclosing_folder.
Is it possible to use singularitygs in sass format rather than SCSS format?
Both singularitygs and breakpoint seems to come with only SCSS format files. If I manually convert the provided files to sass format, will that work?
I tried setting default format to sass in the config.rb file but that just seems to cause errors when starting to watch.
In Compass projects, you can interchange .sass and .scss files in the same project. Import them normally and you'll be OK.
That being said, as of this writing, both require custom Ruby functionality so in order to actually use either Breakpoint or Singularity, you need to be using them as Compass extensions as prescribed in their respective README files.
I used a switch --syntax sass to format a project in sass rather than SCSS:
compass create {project name} -r singularitygs --using singularitygs --syntax sass
SCSS and sass format can be mixed in different files but the watch function will not automatically compile the other format. For instance, if you set the default format to sass then any save to SCSS files will not be automatically processed.
The main reason I was getting the errors were from trying to install extension for compass.app. I am not sure what I am doing wrong but just copying singularitygs and breakpoint to the compass.app extension folder creates error on compass.app as well as the compass command line execution.
I tried:
sass-convert --from scss --to css --recursive app/assets/stylesheets temp
But this only converts css to SASS, and I want the other way around.
Then I looked at the sass command, but it doesn't look like I can pass it a directory.
To do a one-time Sass compile instead of a watch, you can do this from the command line:
sass --update scss:css
To have Sass import one file (usually a partial, with a _ starting the filename), you can do this inside a Sass file:
#import "_base.scss";
This way, Sass knows where you want the include to occur.
By default, Sass can't import an entire directory. The Sass Globbing gem, however, can. You can install it from the command line:
gem install sass-globbing
And then watch with it:
sass -r sass-globbing --watch sass_dir:css_dir
Note that globbing will import files alphabetically, so be sure your CSS will cascade appropriately if this occurs.
Use the sass command followed by the input file name and path, a colon (:) and the desired output file name and path. If the output file does not already exist Sass will generate it. For example,
sass sass/main.scss:css/main.css
However, this is a one-off command that would require being run every time you want to generate a new CSS file. A simpler and handier method is to use Sass's built-in --watch flag. This watches for changes to your Sass file and automatically runs the compile command each time you save changes.
sass --watch sass/main.scss:css/main.css
If you have multiple Sass files within a directory you can watch for changes to any file within that directory:
sass --watch sass:css
Sass also has four CSS output styles available: nested, expanded, compact and compressed. These can be used thus:
sass --watch sass:css --style compressed
Refer to the Sass documentation for more.
to that, simply go your project directory and do this :
sass --update sass-dir:assets/css
with sass-dir the directory containing your actual sass files and assets/css the desired output directory.
Hope this could help.
You can use compass to convert Sass files into CSS.
To initialize the config.rb, try:
compass init --syntax=sass --css-dir=css --javascripts-dir=js
Once you've the configuration file, try:
compass compile
or by specifying the file explicitly: compass compile sass/foo.scss.
To install it, try:
sudo gem update
sudo gem install sass compass
https://sass-lang.com/guide
you can use
sass --watch [input folder path]:[output folder path]
i tried running it in a new terminal and after that sass watches the folder and compiles upon any changes.
you can use this code
sass --watch file.sass:file.css
or
sass --watch folderSass:foldercss
if you want to create css.main you can use this code
sass --watch sass:css --style compressed
I'd like to use Sass with Compass on my static HTML project, but following the instructions does not work. This is what I did:
$ gem install compass
$ cd <myproject>
$ compass install compass .
which was following by awaiting:
directory ./sass/
directory ./stylesheets/
create ./sass/screen.scss
create ./sass/print.scss
create ./sass/ie.scss
create ./stylesheets/screen.css
create ./stylesheets/ie.css
create ./stylesheets/print.css
But when I start watching scss sass --watch sass:stylesheets, I get an error:
error sass/screen.scss (Line 6: File to import not found or unreadable: compass/reset.
This msg coherent with #import "compass/reset";
What do I have to do on my Ubuntu to see that compass imports?
Use compass watch instead of sass --watch sass:stylesheets. If you're using compass, you don't need to bother with sass command. Just use the compass command.
if you really wanted to use sass command i use this code. Considering that you are in your sass directory running the following command.
sass --watch style.scss:../stylesheets/
That simply means that I have created a new file called style.scss and imported the following files within my style.scss. So sass would only watch a single file. In the above command we wishes to have the generated style.css to be in the stylesheet directory.
again its sass --watch style.scss:/path-to-output-directory/
#import "ie";
#import "print";
#import "screen";
so in this process sass is only watching single file style.scss for any changes within sass directory files.
I hope this explains well.