Image paths in Compass CSS on Windows - ruby

I've been using SASS and Compass successfully on my Windows 7 x64 machine. Everything was working fine until I tried using the replace-text-with-images mixin.
I placed the image I'm trying to use in the correct place (t:\Website\stylesheets\stylesheets\images for my system), and checked that relative assets are enabled in my Compass config file. Still, when I try to compile, I get this:
t:\Website\stylesheets>compass watch -c config_with_refresh.rb
>>> Change detected to: code-n-apps.scss
WARNING: 'i_user.gif' was not found (or cannot be read) in t:/Website/stylesheets/images
Errno::ENOENT on line ["34"] of C: No such file or directory - t:/Website/stylesheets/images/i_user.gif
Run with --trace to see the full backtrace
>>> Compass is polling for changes. Press Ctrl-C to Stop.
The file is most definitely in that path, and is readable.
Any help would be most appreciated. Ideally, I'd like Compass to grab the images directly off my production server (http), but even having it work locally would be a major improvement.

You say that this is your image-path:
t:\Website\stylesheets\stylesheets\images
Then of course it will not find i_user.gif in
t:/Website/stylesheets/images/
Please double check your path, note that the first time you are using stylesheets/stylesheets and you want to load the image from stylesheets

Related

Editing SASS files (.SCSS)

I'm a complete beginner with SASS!
I have a custom built WP site which uses SASS.
When I try to edit any styles inside the .SCSS files these changes do not show on the frontend.
I'm using VS Code editor with the "Live SASS compiler" add-on but still when I make changes they do not reflect on the front end.
I'm clearly missing something here but really don't know where to start.
All I want to do is make changes to the styling of the site!
Thanks
You will need to ensure that SASS is installed on your machine - check out the offical install link.
Once SASS is installed, the rest of this answer will involve using the command line with some basic commands.
Lets assume your CSS and SCSS/SASS folders are arranged like so:
C:/Users/Me/development
/wordpress/wp-content/themes/my-theme/assets/css
/wordpress/wp-content/themes/my-theme/assets/scss
Open up your preferred command line interface - like PowerShell or Command Prompt. First of all, check SASS is installed by typing the following command and hitting enter:
sass --version
You should get a number back - if not, you will need to run over the installation instructions again and make sure you did everything correctly.
If that's working as expected, you will now need to navigate to the directory containing your assets. When you load your command line interface, you should be inside your user or home directory - in this example that will be C:/Users/Me. If using PowerShell, you will see your current working directory before the flashing caret.
You can use the change directory command - cd - to navigate to your themes assets folder. Using the above example filepath:
cd development/wordpress/wp-content/themes/my-theme/assets
Once inside this directory, you can run the SASS --watch command to watch the directories for changes and compile upon save:
sass --watch scss:css
The above watches the SCSS folder and puts the compiled CSS in the CSS folder. Once you're done editing, hit CTRL/CMD + C inside your terminal (command line) and then Y to stop watching the SCSS files for changes.

Compiling sass with SassyStudio and Compass and multiple areas

Iam trying SassyStudio für Visual Studio to compile the SASS in our project - but there area some issues.
The project is structured like this:
Solution
- Project 1
-- Areas
--- Area 1
---- Styles
----- style.scss
------ style.css
--- Area 2
---- Styles
----- style.scss
------ style.css
-- Styles
--- globalstyle.scss
---- glogalstyle.css
As you can see the scss files are scattered all around the project. The css Files should be compiled beside the scss files. Since there are compass references within the scss files there are dependencies to compass.
Mindscape Web Workbench is not designed to work like this.
I installed Ruby + gem sass + gem compass and
sass --watch C:/compasstest:C:/compasstest --compass
works well. But I dont like to start a batch everytime I start developing.
So I found SassyStudio an it pretty looks like what I need. But there are some issues with the compass references. In the options I entered "C:\Program Files (x86)\Ruby193\bin" to Ruby Install Path and "C:\compass" to the Include Paths property. The Compass Folder contains for example the "compass/css3" structure from github.
12:00:52.447 : Failed to compile css.
[SassCompileException]c:\compass/compass/css3/shared:1: error: file to import not found or unreadable: "compass/support"
at NSass.SassCompiler.CompileFile(String inputPath, OutputStyle outputStyle, Boolean sourceComments, IEnumerable`1 additionalIncludePaths)
at SassyStudio.Integration.LibSass.NSassDocumentCompiler.Compile(FileInfo source, FileInfo output)
at SassyStudio.Editor.GenerateCssOnSave.GenerateCss(DateTime time, String path)
12:00:52.447 : Compile complete.
What exactly is Ruby Install Path for?
Do I need the config.rb even if I dont want so specifiy specifiy sass and css folder?
How can I tell SassyStudio to find the file compass/support (It already found compass/shared as we can see)?
OK, so the sass --compass is new to me, so I don't know if I can comment on that.
Here is what you want to do.
First, change your ruby path to this C:\Program Files (x86)\Ruby193 as you don't need the bin directory in there (and not sure if it would cause issue or not).
Next, for me to detect that you are using compass (vs sass gem), I look for the config.rb file, and I believe that compass requires this to work as well, but not exactly sure on that. For me though, I definitely need it.
Now, what happens when you save a file is that I go looking for that config.rb from the current directory upward, so I believe that you can achieve what you are wanting to do through the use of multiple compass.rb files. So, that means if you put one in Area 1, one in Area 2, and one in Styles, I think it will work (but I've never tried).
I'm a bit unfamiliar with the syntax of compass.rb but I'm sure you will be able to figure out something that works there. That file may need to go into the Styles folder instead of root folders, I don't remember for sure (I think styles is perhaps configured in config.rb).
Let me know if you need anymore help.

Compass + Dropbox = File to import not found or unreadable

I've got a funny error.
My sass files are located on a Dropbox folder. I edit them locally on my dev pc, and then they're synced via Dropbox to the server. On the server I have a CentOS installed with CLI Dropbox service.
I have an app.scss file and a _settings.scss file included from app.scss. If I edit _settings.scss, the following error is thrown:
error app.scss (Line 2: File to import not found or unreadable: settings.
Load paths:
/www/psmb.dev/web/typo3conf/ext/speciality/Resources/Public/foundation/sass
/usr/local/lib/ruby/gems/1.9.1/gems/compass-0.12.2/frameworks/blueprint/stylesheets
/usr/local/lib/ruby/gems/1.9.1/gems/compass-0.12.2/frameworks/compass/stylesheets
/usr/local/lib/ruby/gems/1.9.1/gems/zurb-foundation-4.3.1/scss
Compass::SpriteImporter)
If I then change something in app.scss, it's compiled without error.
Now the funny thing: if I edit _settings.scss locally on the server, or via ssh, then no error is thrown!
What's up?
After some suggestion and Dmitri's test verification, we came to the conclusion that most likely compass watch caught the file change "too early" while dropbox process is in the midst of making complete sync of the file. The file sync is probably implemented by 2 or more successive file update steps.
Potentially the problem can be resolved if compass watch's compile trigger can be delayed somewhat. For now Dmitri decided to use ftpsync instead.
Make sure that you are using linux line endings in your SASS files, as that is probably making it fail to compile.
When you edit it in windows, it's probably setting it to the windows line ending.
When you then edit it in CentOS, it's probably settings them to the unix line ending.

"The system cannot find the path specified" when compiling SASS

I'm trying to learn SASS and so I have installed ruby through RubyInstaller and installed the sass gem.
I am able to type out my sass and have the compiler watch the file and write to another just fine, but every time I save my file I get
The system cannot find the path specified
C:\Program Files (x86)\Notepad++)
However everything works as intended, the styles are updated and compiled just fine, but it's quite annoying hitting ctrl+s and having that error keep popping up when it doesn't seem to be affecting anything.
How do I go about troubleshooting this?
Here is a solution for anyone else having the same trouble on notepad++:
Sass-Auto-Compile
For using the Sass-Auto-Compile plugin, you first need to install
another plugin called jN. jN is a plugin for Notepad++, which executes
your JavaScript-scripts in the Notepad++ environment, meaning you can
write plugins in JavaScript
this is the link :
http://www.ninjagame.de/blogContent/Sass-Auto-Compile.js
To get the auto-compiling working, you need to do two things:
Copy this script into the directory “Notepad++/plugins/jN/includes/” .
Now edit the script and change the variable pathToRubyBinDir to the
right value. Mine is: “C:/Program Files/Ruby193/bin/” .
OPTIONAL: There are two more configuration variables:
debugMode: can be true or false. In case of true, you will see the
command line, which calls the compiling process. You can see compiling
errors in this command line window.
outputStyle: this determines, how your .css is going to look like.
(compressed, extended…). See the comments above this variable for more
information.
This guide is copied and pasted from http://deekaysblog.wordpress.com

Error with Compass polling on windows 7

I am attempting to work locally on a PHP application which I cloned from the Git repository my partner and I use.
He uses a Mac, and until now I have been working on the app in a virtual Ubuntu Linux environment. Both environments have been able to use Compass polling with the same file structure and files.
On Windows 7, I run Compass commands from Cygwin, and this is the command I use to have Compass poll from the root directory of the app (C:/wamp/www/application):
compass watch --trace src/Application/ApplicationBundle/Resources/compass/
When I then make a change to a .scss file, I receive the following error:
ArgumentError on line 716 of /usr/lib/ruby/1.8/pathname.rb: different prefix: "/
/cygdrivecwampwwwlimelightsrclimelightlimelightbundleresourcescompasssrcpartials
_object.scss" and "/cygdrive/c/wamp/www/limelight/src/limelight/limelightbundle/
resources/compass/src"
/usr/lib/ruby/gems/1.8/gems/fssm-0.2.7/lib/fssm/path.rb:81:in 'split_path'
/usr/lib/ruby/gems/1.8/gems/fssm-0.2.7/lib/fssm/path.rb:69:in 'run_callback'
/usr/lib/ruby/gems/1.8/gems/fssm-0.2.7/lib/fssm/path.rb:55:in 'callback_action'
/usr/lib/ruby/gems/1.8/gems/fssm-0.2.7/lib/fssm/path.rb:35:in 'update'
/usr/lib/ruby/gems/1.8/gems/fssm-0.2.7/lib/fssm/state/directory.rb:39:in 'modified'
/usr/lib/ruby/gems/1.8/gems/fssm-0.2.7/lib/fssm/state/directory.rb:37:in 'each'
/usr/lib/ruby/gems/1.8/gems/fssm-0.2.7/lib/fssm/state/directory.rb:37:in 'modified'
/usr/lib/ruby/gems/1.8/gems/fssm-0.2.7/lib/fssm/state/directory.rb:18:in 'refresh'
/usr/lib/ruby/gems/1.8/gems/fssm-0.2.7/lib/fssm/backends/polling.rb:17:in 'run'
/usr/lib/ruby/gems/1.8/gems/fssm-0.2.7/lib/fssm/backends/polling.rb:17:in 'each'
/usr/lib/ruby/gems/1.8/gems/fssm-0.2.7/lib/fssm/backends/polling.rb:17:in 'run'
/usr/lib/ruby/gems/1.8/gems/fssm-0.2.7/lib/fssm/backends/polling.rb:15:in 'loop'
/usr/lib/ruby/gems/1.8/gems/fssm-0.2.7/lib/fssm/backends/polling.rb:15:in 'run'
/usr/lib/ruby/gems/1.8/gems/fssm-0.2.7/lib/fssm/monitor.rb:26:in 'run'
/usr/lib/ruby/gems/1.8/gems/fssm-0.2.7/lib/fssm.rb:20:in 'monitor'
/usr/lib/ruby/gems/1.8/gems/compass-0.11.1/lib/compass/commands/watch_project.rb:86:in 'perform'
/usr/lib/ruby/gems/1.8/gems/compass-0.11.1/lib/compass/commands/base.rb:18:in 'execute'
/usr/lib/ruby/gems/1.8/gems/compass-0.11.1/lib/compass/commands/project_base.rb:19:in 'execute'
/usr/lib/ruby/gems/1.8/gems/compass-0.11.1/lib/compass/exec/sub_command_ui.rb:43:in 'perform!'
/usr/lib/ruby/gems/1.8/gems/compass-0.11.1/lib/compass/exec/sub_command_ui.rb:15:in 'run!'
/usr/lib/ruby/gems/1.8/gems/compass-0.11.1/bin/compass:25
/usr/lib/ruby/gems/1.8/gems/compass-0.11.1/bin/compass:39:in 'call'
/usr/lib/ruby/gems/1.8/gems/compass-0.11.1/bin/compass:39
/usr/bin/compass:19:in 'load'
/usr/bin/compass:19
All I've been able to find through searching is that it may have something to do with the fact that Windows capitalizes its drive names, although the lack of slashes in the returned path makes me think the problem may be elsewhere.
Does anyone know why I might receive this error in Windows, but not other platforms?
NOTE: I have found a work-around involving installing ruby (and compass) through Windows' command prompt rather than Cygwin, and that should work fine for now. Still, if anyone has ideas, I'm still curious as to what the problem could be.
According to this commit, this is a problem caused by a compass dependency called FSSM. It is used to monitor file changes in compass. A workaround is described in this comment.
It seems that FSSM detects that ruby is running inside a Windows box, and treats paths in the Windows' way (C:\blabla). Commenting out the line 26 of the file <fssm_gem_path>/lib/fssm/pathname.rb makes compass watch work as expected. You can also add
unless path[0, 1] == File::SEPARATOR
to the end of line 26 to make it work.
I thought I'd just provide a little more info to help people find the pathname.rb file.
On the cygwin prompt type:
gem env
This (unsurprisingly) brings up a load of info about your Ruby Gems installtion. Look for the line which specifies the INSTALLATION DIRECTORY. Mine was:
/usr/lib/ruby/gems/1.8
Now in Windows Explorer navigate to this location but substitute "usr" for your cygwin installation directory. Therefore the above path becomes:
C:\cygwin\lib\ruby\gems\1.8
Once in this location drill down until you come across the fssm gem directory.
Within this [fssm] directory go into:
/lib/fssm/
...and there you should find the pathname.rb file.
Edit it as above and all is well. I hope this helps.
See here for a possible fix:
http://rails.webintellix.com/2010/05/27/error-in-ruby-relative_path_from-call-on-windows/
I was running into this same error with a slightly different setup. My project folder was on a network drive (ruby and sass/compass installed locally), and every time I made a change to a .scss file compass watch would crash with similar errors to the OP. I solved the issue by mapping my network drive instead of accessing it directly via the network (right clicked on My Computer and choose map network drive so I could access my remote drive at A:).
Now, instead of doing 'compass watch //SERVERNAME/My_Project' (I'm using Git Bash), I do 'compass watch a/My_Project' and compass stopped crashing.
Hope that helps someone else.
Using Cygwin, re install a compass dev release (such as 0.13+). Works for me with Compass 0.13.alpha.4 (Markab)
To do so:
gem uninstall compass
gem install compass --pre --no-rdoc --no-ri

Resources