Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Compass not running with Grunt on Windows 7

I am currently watching for any changes in my sass files: ['_/components/sass/*.scss']

When I run grunt watch (via the Node.js terminal with Admin permissions) everything seems to be working fine.

If I however make any changes to an .scss file, I get following error:

File "_\components\sass\styles.scss" changed.
Running "compass:dev" (compass) task
Warning: Command failed: C:\Windows\system32\cmd.exe /s /c "compass.bat --version"

The command "compass.bat" is either spelled incorctly or cannot be found.
Use --force to continue.

Aborted due to warnings.
Completed in 3.510s at Mon Aug 24 2015 13:15:13 GMT+0200 (Mitteleuropäische Somm
erzeit) - Waiting...

As you can see the Grunt Watch works. It picked up a change to my .scss file, but when it tries to execute 'compass:dev' it then tries to call "compass.bat --version". What I have figured out is that the correct path/cmd command to compass.bat should be:

C:\Ruby22-x64\bin\compass.bat --version

So I suspect this is some PATH issue??

How do I get this programm to basically run this command:

C:\Windows\system32\cmd.exe /s /c "C:\Ruby22-x64\bin\compass.bat --version"

instead of this (which it is currently doing):

C:\Windows\system32\cmd.exe /s /c "compass.bat --version"

This is my gruntfile.js:

module.exports = function(grunt) {

    grunt.loadNpmTasks('grunt-contrib-uglify');
    grunt.loadNpmTasks('grunt-contrib-watch');
    grunt.loadNpmTasks('grunt-contrib-compass');

    grunt.initConfig({
        uglify: {
            my_target: {
                files:{
                    '_/js/script.js' : ['_/components/js/*.js']
                }//files
            } //my_targer
        }, //uglify

        compass: {
            dev: {
                options: {
                    config: 'config.rb'
                } //options
            }// dev
        }, //compass

        watch: {
            options: { livereload: true },
            scripts: {
                files: ['_/components/js/*.js'],
                tasks: ['uglify']
            }, //scripts

            sass: {
                files: ['_/components/sass/*.scss'],
                tasks: ['compass:dev']
            }, //sass

            html : {
                files: ['*.html'],
            } //html

        } //watch

    }) //initConfig

    grunt.registerTask('default', 'watch');


} //exports

This is my config.rb file:

css_dir = '_/css'
sass_dir = '_/components/sass'
javascripts_dir = '_/js'
output_style = :nested

This is my package.json file:

{
    "name" : "Lorum",
    "version" : "0.0.1",
    "dependencies" : {
        "grunt": "~0.4.5",
        "grunt-contrib-watch" : "~0.6.1",
        "grunt-contrib-compass" : "~1.0.3",
        "grunt-contrib-uglify" : "~0.9.1",
        "matchdep" : "~0.3.0 "
    }
}

Other environmental variables:

  • sass (3.4.17)
  • compass (1.0.3)
  • compass-core (1.1.0.alpha.3, 1.0.3)
  • compass-import-once (1.0.5)
  • OS: Windows 7 64bit
like image 993
Arman Nisch Avatar asked Feb 10 '23 05:02

Arman Nisch


1 Answers

I faced the same issue (windows 7 64 bits) and I solved by installing ruby and then the compass gem.

Depending on your system (I'm on windows too), you can download ruby here:

http://rubyinstaller.org/downloads/ 

Then don't forget to set up the environment variables on windows I think you can do that directly from the installer, but also from Computer -> Control Panel -> Edit Environment Variables. Then on System Variables, add to the Path variable the ruby path, (I did that on http://i.stack.imgur.com/928Y7.png).

Finally open a CMD terminal and write:

gem install compass

Now grunt should be working well:

grunt serve
Running "compass:server" (compass) task
directory .tmp/styles 
write .tmp/styles/main.css (0.096s)
write .tmp/styles/main.css.map

Done, without errors.

I hope that helps, regards, Jose

like image 98
Jose Enrique Pons Frias Avatar answered Mar 05 '23 19:03

Jose Enrique Pons Frias