I know this is probably more a Ruby question but I work on several projects where I've used compass plugins. Later on I upgrade these plugins and start new projects. The issue arises when I need to go back and make amends to an older project.
How can I amend my config.rb file to use a specific version of a gem?
For example I often use the Compass plugin: http://rubygems.org/gems/html5-boilerplate/versions
The line in my config.rb file looks like this:
require 'html5-boilerplate'
But I would need 1.0.0 for one project and 2.1.0 in another.
Suggest using rvm (the Ruby enVironment Manager), bundler and gemsets. rvm for managing ruby versions and for allowing you to use gemsets - bundler to specify the versions of the gems you want to use in the project. After you install the bundler gem and have a Gemfile that uses the syntax you have already discovered
gem "html5-boilerplate", "~> 2.1.0"
bundle install will then bring down the gems you need for your project. Read more at http://gembundler.com
gemsets can also be project specific and different gemsets can have the same gems at different versions. you can specify the gemset associated with a project via a .rvmrc file in the project's root.
There are several nice posts out there on how to set up rvm and gemsets. Here's a good example of one to get you going:
http://adamstacoviak.com/posts/super-easy-ruby-gem-management-with-rvm-gemsets/
And here's one that also covers bundler:
http://lindsaar.net/2010/3/31/bundle_me_some_sanity
Related
New to Jekyll and new to Ruby I tried to include autoprefixer-rails for my (s)css files directly into Jekyll. So once the page is generated by Jekyll autoprefixer would run over my generated css files. Unfortunately, I haven't managed to set things up properly and autoprefixer doesn't seem to even touch my files.
Following my Gemfile:
source "https://rubygems.org"
gem 'jekyll'
gem 'jekyll-assets'
gem 'autoprefixer-rails'
And parts of my Jekyll configuration file:
...
gems: ['jekyll-assets', 'autoprefixer-rails']
...
Which settings are missing to make it work?
Any help is appreciated!
I am able to use it with jekyll 3 by installing the octopress autoprefixer here:
https://github.com/octopress/autoprefixer.
You then put:
gems: [octopress-autoprefixer] in your config file. I am not using octopress, I only installed this to see if it would work.
In the process I also installed node.js (on a pc , win 10), so I could install autoprefixer-rails. Not sure if the octopress installer took care of this or not though, I was just trying random things to see if it would work. I think node.js was a requirement as I remember nothing happened until I rebooted and then everything worked.
It works great, though it does slow my build time down - on a small site that normally builds in .5 seconds it goes up to 12 seconds.
That's perfectly possible, and easy, too!
Most resources you'll find online will suggest to switch to Jekyll Assets, which comes with a number of default plugins, including autoprefixer-rails. That, however, replaces the entire Jekyll asset pipeline, and requires changes in lots of places. A fairly high investment up front, just to get it working. Plus, the project appears to be dormant.
Continuing my quest to find a simple solution to a simple problem, I came across jekyll-autoprefixer, available as a Ruby Gem. Integrating that into my Jekyll workflow was embarrassingly straightforward:
Update the Gemfile to include the following:
gem "jekyll-autoprefixer", "~> 1.0.2"
Add the following to _config.yml:
plugins:
- jekyll-autoprefixer
Optionally add required browser support to _config.yml (e.g. for the latest 2 versions and Edge version 14 and up):
autoprefixer:
browsers:
- last 2 versions
- Edge >= 14
Note: You can alternatively supply a .browserslistrc file in the root directory.
Optionally enable CSS Grid Layout prefixing. This appears to be unsafe, and is disabled by default. You can either enable it from CSS code using a control comment (e.g. /* autoprefixer grid: autoplace */), or globally through _config.yml:
autoprefixer:
grid: autoplace
That's all that's needed to integrate autoprefixer into Jekyll.
Documentation to add Autoprefixer to Jekyll with jekyll-assets and autoprefixer-rails has been updated:
https://github.com/jekyll/jekyll-assets#addons
autoprefixer-rails is a Rails plugin, it has nothing to do with Jekyll and can't be used in Jekyll.
If you need a similar feature in Jekyll, you currently have no other options than develop it yourself. You can grab part of the code from the Rails plugin, but the way Jekyll plugins work is significantly different.
I am using windows 7 to compile .scss with an application known as Prepros. (http://alphapixels.com/prepros/ ). I also downloaded the Gumby Framework(http://gumbyframework.com/) into my document root directory of localhost web-server. My goal is to use the gumby framework along with Prepros.
When I attempt to compile the scss file, I am receiving the following error:
Syntax error: Undefined operation: "power(golden_ratio(), 1) times 16px".
on line 52 of Z:/Ampps/www/Gumby-master/sass/extensions/modular-scale/stylesheets/_modular-scale.scss
from line 23 of Z:\Ampps\www\Gumby-master\sass\gumby.scss Use --trace for backtrace.
Also, if it is helpful, this is the config.rb file contained within the folder www\Gumby-master :
# Require any additional compass plugins here.
# Tell compass where to find local extensions
# If you followed directions and ran 'gem install modular-scale' comment the next two lines out:
extensions_dir = "sass/extensions"
Compass::Frameworks.register('modular-scale', :path => File.expand_path("# {extensions_dir}/modular-scale"))
# Uncomment these to use regular Ruby gems.
# require 'modular-scale'
# require 'sassy-math'
# Set this to the root of your project when deployed:
http_path = "/"
css_dir = "css"
sass_dir = "sass"
images_dir = "img"
# You can select your preferred output style here (can be overridden via the command line) :nested or :expanded or :compact or :compressed:
output_style = :compact
# 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
# If you prefer the indented syntax, you might want to regenerate this
# project again passing --syntax sass, or you can uncomment this:
# preferred_syntax = :sass
# and then run:
# sass-convert -R --from scss --to sass sass scss && rm -rf sass && mv scss sass
Lastly,I reviewed this thread, but I did not find it helpful.
SOLUTION: I tried several things to fix this, and I am not absolutely which of them were responsible for fixing it.
Install ruby development kit
Install rails
Install gumby-framework gem (https://github.com/jorgecoca/gumby-framework)
Verify that the modular-scale gem is installed ( https://github.com/Team-Sass/modular-scale)
Use Advanced Prepros options to use third-party compass plugins (http://alphapixels.com/prepros/docs/sass-compass.html) (NOTE: initially I made the mistake of giving this path C:\Ruby193\lib\ruby\gems\1.9.1\gems, when in fact I realized I must provide this one C:\Ruby193\bin\ruby.exe, just like in the picture in the Prepros manual.)
-as stated in this thread, I opened my compass config.rb and commented out Compass::Frameworks.register('modular-scale', :path => File.expand_path("#{extensions_dir}/modular-scale")), and un-commented #require 'modular-scale' and #require 'sassy-math'.
I also ran into this exact same issue. So I would like to share things which I did.
Gumby framework README.md file states "Note: Please use modular scale 1.0.6, 2.x has not been integrated yet". Make sure the version of modular scale installed on your machine is 1.0.6!
How to check?
Let's assume the location of your Ruby installation is "C:\Ruby200".
Go to C:\Ruby200\lib\ruby\gems\2.0.0\gems. In this directory, you will see all the gems that were installed on the machine. (You should see sass, compass, modular-scale among others)
Make sure it says "modular-scale-1.0.6". If it doesn't, then delete the version you have over there. If you see multiple sassy-math over here, don't worry. We just want one modular-scale on the machine!
How to install Modular Scale v1.0.6?
Run gem install modular-scale v 1.0.6
What else to watch out for?
Like Daniel said, open your config.rb. Make sure you have the following lines in it!
#Require any additional compass plugins here.
require 'modular-scale'
require 'sassy-math'
Whatever you do, don't have the following code in your config.rb file. For this code to truly work, you have to have a directory called extensions in your sass directory, and you have to copy all the modular-scale binaries into that directory.
extensions_dir = "sass/extensions"
Compass::Frameworks.register('modular-scale', :path => File.expand_path("#{extensions_dir}/modular-scale"))
If you run into any other problems and somehow manage to solve it, please do add your answer here! The entire installation experience is terrible at the moment.
+1 for Parth Shah -- that worked for me. But the command to install modular-scale 1.0.6 is actually:
gem install modular-scale -v 1.0.6
He missed the hyphen before the v.
BTW as per this date, there has been a Gumby update so that Gumby supposedly now works with these compass, sass and modular-scale versions -- see below for install commands.
gem install compass -v0.12.4,
gem install sass -v3.2.18
gem install modular-scale -v2.0.4
I am still running the older versions but this update has been confirmed by other Gumby users.
I'm on Windows, and I have SASS running successfully in my project. Now, I want to include compass so I can take advantage of the pre-written mixins, etc.
First I simply tried this statement from within my working sass file: #import "compass/css3/transform";
Naturally, this didn't work since I didn't have compass installed, so I navigated to my Ruby directory and successfully installed the compass gem within c:/ruby193/bin. I can now successfully create compass projects within c:/ruby193/bin, but that doesn't do me much good.
I need run compass commands within my site, which lives here: c:/inetpub/mysite. When I try to do so, however, I get compass is not recognized as internal or external command
How can I get compass to work where I want it?
EDIT: a large part of my problem was that Ruby was installed without adding itself to the Windows Path environment variables, so I could only run SASS and Compass commands from within the C:/Ruby193/bin directory. This caused problems for me since, as a result, I thought that was where I needed to install compass. Anyhow, after figuring that out, I still haven't been able to get compass to work, but am planning on uninstaling SASS, Compass, and Ruby and giving this thing another try from scratch. I marked Stooboo's answer as correct since it was the best and most accurate, especially given the information he had to work with. Thanks!
here's how I do it
(One time)
install ruby http://rubyinstaller.org/
install compass, in a command window enter
gem install compass
to add compass to an MVC project, navigate to project folder and in a command window enter
compass create
you will get the default config.rb ... but here is my usual one
http_path = "/"
css_dir = "content/css"
sass_dir = "content/sass"
images_dir = "images"
javascripts_dir = "scripts"
to install bootstrap (for more info see https://github.com/thomas-mcdonald/bootstrap-sass)
add
require 'bootstrap-sass'
to your config.rb
enter (in your command window)
gem install bootstrap-sass
(I had to do a (in your command window)
gem update
after this but you may not need to)
enter (in your command window)
compass install bootstrap
(then ... every time you open the solution in Visual Studio)
navigate to project folder
in a command window enter
compass watch
(this will monitor project for saves and re-compile the scss files)
Hope that helps
Cheers
Stu
To install Compass, you should open your Windows console with Win+R, cmd and run:
gem update --system
gem update
gem install compass
Don't forget to remove all the stuff that you littered you Ruby installation with.
Use this command in order to add GEM to the Windows Path environment variables:
set PATH=C:\Ruby200-x64\bin;%PATH%
In the Ruby command you should write:
gem update --system
(this block of code updates all the gems in the Ruby)
Then you install sass like it:
gem install sass
(You said that you already has sass, so you don't need to write this code again.)
Then, you write this line:
gem install compass
(Now, you will have compass in your machine)
To know the version that was installed, you can write:
compass --version
To create a new project in your desktop machine, you can write this line of code:
compass create desktop/my-project
(This will create a compass folder in the desktop of your machine called my-project. I hope this is helpful.
I am working with sass to write the css for a simple static website I am working on. I have run sass --watch custom.scss:custom.css which compiles fine on launch with the message:
Sass is watching for changes. Press Ctrl-C to stop.
overwrite custom.css
However, whenever I update the .scss file, nothing happens. I haven't used SASS outside the context of a rails app before, so I'm wondering if I am missing something?
My scss file is incredibly simple as well, so I doubt it is choking on anything, especially since it works on the first run.
sass -v reports Sass 3.1.16 (Brainy Betty), on Lion 10.7.2
This has now been fixed in the latest commit.
The updated stable gem (3.1.17) hasn't been released yet but there are a few choices while you wait:
Stick with 3.1.16 and use absolute paths when loading up watch, e.g:
sass --watch /User/name/project/scss:/User/name/project/css
The bug should only occur with relative paths so this works around it.
Use the updated (alpha) version
gem install sass --pre
Temporarily roll back to 3.1.15 as suggested by #Marco Lazzeri
Same problem here.
I don't know exactly what the problem is, but rolling back to the previous version is a temporary workaround:
gem uninstall sass -v=3.1.16
gem install sass -v=3.1.15
As it is mentioned by pjumble, it is a known bug in process. You can use absolute path to address this problem, before a new version is release.
This is what I usually do to avoid typing a full path:
cd work-directory
sass --watch `pwd`/sass:`pwd`/css
Hope this work for you:)
I too had the same problem.
Just by updating my gem, it worked.
gem update sass
I had this problem too with the latest SASS version at this time. Downgrading to version 3.2.9 did the trick to me on 2 different Windows 8 computers.
gem uninstall sass
gem install sass -v 3.2.9
I Had a similar problem: "Change detected", but then no writing despite it compiling and overwriting the .css file days before.
Notes:
Reinstalling sass in Ruby didn't work.
I pointed sass --watch at some other projects and they worked.
What seemed to create this problem was that I had made a copy of one project while it was being watched, then started watching the second project.
I can't say for sure but this seem to "trip up" Ruby, maybe it was the cache or some stored info about the file locations.
Solution:
I just created a newly named project folder, dragged into it all the scss files from the second project, renamed the main scss file (e.g. "uikit-main.scss" to "uikit.scss"), --watch it, and it began overwriting correctly again.
I`ve also stuck with sass (v3.4.23) not recompiling after the first run, but it was realted with scss`s folder structure - Sass can`t watch changes in files that are located by the path directing upwards the watching file. Link for details
In my case, the problem was because I'm using sass in a vagrant machine with ubuntu. I install and run sass directly from my host OS (Mac) and the watch mode starts to work.
I'm trying to use Susy as the grid element in a project
http://susy.oddbird.net/
FYI I'm also using the following libraries
Compass
Assetic
Symfony (2.x)
Ubuntu (10.4)
When I try to import susy in my sass file
#import "compass/reset"
#import "compass/css3"
#import "susy" <- This line causes a server internal error (500)
I'm sure that this is because compass is unable to locate the susy files to include. Can someone with a successful installation please tell me where these susy files should be located? After installing the compass-susy-plugin using gem installer I can see the following...
ubuntu#ubuntu-desktop:/$ locate susy
/home/ubuntu/.gem/ruby/1.9.1/gems/compass-0.11.5/examples/susy
/home/ubuntu/.gem/ruby/1.9.1/gems/compass-0.11.5/examples/susy/bootstrap.rb
/home/ubuntu/.gem/ruby/1.9.1/gems/compass-0.11.5/examples/susy/clean.rb
/home/ubuntu/.gem/ruby/1.9.1/gems/compass-0.11.5/examples/susy/config.rb
/home/ubuntu/.gem/ruby/1.9.1/gems/compass-0.11.5/examples/susy/src
/home/ubuntu/.gem/ruby/1.9.1/gems/compass-0.11.5/examples/susy/src/_base.scss
/home/ubuntu/.gem/ruby/1.9.1/gems/compass-0.11.5/examples/susy/src/_defaults.scss
/home/ubuntu/.gem/ruby/1.9.1/gems/compass-0.11.5/examples/susy/src/screen.scss
/var/lib/gems/1.8/gems/compass-0.11.5/examples/susy
/var/lib/gems/1.8/gems/compass-0.11.5/examples/susy/bootstrap.rb
/var/lib/gems/1.8/gems/compass-0.11.5/examples/susy/clean.rb
/var/lib/gems/1.8/gems/compass-0.11.5/examples/susy/config.rb
/var/lib/gems/1.8/gems/compass-0.11.5/examples/susy/src
/var/lib/gems/1.8/gems/compass-0.11.5/examples/susy/src/_base.scss
/var/lib/gems/1.8/gems/compass-0.11.5/examples/susy/src/_defaults.scss
/var/lib/gems/1.8/gems/compass-0.11.5/examples/susy/src/screen.scss
It only seems to have saved the susy files into the examples folder - should it also have copied them into the 'frameworks' or libs folder (it hasnt)?
Or is the above correct - in which case how do the 'import' decelerations in the compass file relate to (from the files system POV) the sass files themselves?
BTW: Everything is working great except for this one issue.
P.S
If someone with a rep of over 1500 want to create two new tags then 'Assetic' and 'Susy' should be attached to this post
It looks like the susy gem didn't install properly. I uninstalled/reinstalled and the gem now shows up when I do a gem list as compass-susy-plugin.
Everything now works - I would add that I also needed to add the line require 'susy' to my compass configuration.