sassbundlercompass-sassgulpsingularitygs

gulp isn't noticing sass/compass extension imports / bundler


This is my first time using gulp. Up until now I've always used bundle exec compass watch to compile my scss files.

I'm getting the following error in the command prompt when I run gulp:

Syntax error: file to import not found or unreadable: singularitygs

load paths:  ... .. on line 14 of C:\<my path>\scss\partials\0_global\_base.scss

events.js:72 throw er; /unhandled 'error' event

<-[36mgulp-ruby-sass<-[39m] Error in plugin '<-[36mgulp-ruby-sass<-[39m':
.. 
..
at ChildProcess. <anonamous> c:\<my path>\node_modules\gulp-ruby-by-sass\index.js:100:25)
at ChlidProcess.EventEmitter.emit(events.js:98:17)
at maybeClose(child_process.js:743:16)
at Process.ChildProcess._handle.onexit (child_process.js:810:5)

On my _base.scss file, it's seeing:

@import 'singularitygs';
@import 'toolkit';
@import 'sassy-buttons';

All of these extensions are declared in my config.rb file and in my gemfile and work fine when I run bundle exec compass watch

If I comment out singularitygs, I get the same error for toolkit and sassy-buttons if I comment out toolkit. If I comment all of them out, it throws me an error because it doesn't notice variables that toolkit uses.

My gulpfile.js includes the following:

var gulp = require('gulp'),
    sass = require('gulp-ruby-sass'),
    autoprefixer = require('gulp-autoprefixer'),
    minifycss = require('gulp-minify-css'),
    jshint = require('gulp-jshint'),
    uglify = require('gulp-uglify'),
    imagemin = require('gulp-imagemin'),
    rename = require('gulp-rename'),
    clean = require('gulp-clean'),
    concat = require('gulp-concat'),
    notify = require('gulp-notify'),
    cache = require('gulp-cache'),
    livereload = require('gulp-livereload')
    compass = require('gulp-compass');

gulp.task('styles',function(){
    return gulp.src('scss/*.scss')
        .pipe(sass({style: 'expanded', bundleExec:true}))
        .pipe(compass({config_file: 'config.rb', css:'stylesheets', sass:'scss', font:'stylesheets/fonts', require: ['singularitygs', 'toolkit', 'sassy-buttons'], bundle_exec:true}))
        .pipe(autoprefixer('last 2 version', 'safari 5', 'ie 8', 'ie 9', 'opera 12.1', 'ios 6', 'android 4'))        
        .pipe(gulp.dest('dist/assets/css'))
        .pipe(rename({suffix: '.min'}))
        .pipe(minifycss())
        .pipe(gulp.dest('dist/assets/css'))
        .pipe(notify({message: 'Styles task complete'}));
});

I've been racking my brain at this for over 4 hours and having searching elsewhere for what it could with zero luck. I'm surely not the first person to not have bundled dependencies not work with gulp.

All of my gems are up to date and everything works fine when I compile with bundle exec compass watch. I've also tried reinstalling several different gulp packages like:

npm install gulp-ruby-sass
npm install gulp-compass

I'm also using WAMP and windows 8,.. if that matters at all.

Thanks for your time.


Solution

  • gulp-ruby-sass was messing things up, for some reason. Seems like more people would have ran into this problem before me though.

    I commented out sass = require('gulp-ruby-sass'), and .pipe(sass({style: 'expanded', bundleExec:true})) and it worked.