CODEWITHSUNDEEP
sassmixinsgulp
Chris
Chris

Reputation: 4080

gulp-ruby-sass can't find mixins

I'm just getting started with Gulp.js and Sass and I'm stuck with using mixins.

Here is my gulp.js file:

var gulp = require('gulp');
var autoprefixer = require('gulp-autoprefixer');
var sass = require('gulp-ruby-sass');

gulp.task('css', function(){

    return gulp.src('./assets/scss/main.scss')
        .pipe(sass({
            style: 'expanded',
            noCache: true
        }))
        .pipe(autoprefixer('last 5 versions'))
        .pipe(gulp.dest('./assets/css'));
});

gulp.task('watch', function(){
    gulp.watch('./assets/scss/*.scss', ['css']);
});

gulp.task('default', ['css', 'watch']);

And this is my main.scss file:

#data {
  @include left(10px);
  @include table-base;
}

This is the error it produces:

events.js:72
        throw er; // Unhandled 'error' event
              ^
[gulp] Error in plugin 'gulp-ruby-sass':
Syntax error: Undefined mixin 'left'.
        on line 2 of /vagrant/gulp_test_1/assets/scss/main.scss, in `left'
        from line 2 of /tmp/a4d96d4a-b823-4828-a37c-eab307477784/main.scss

    at ChildProcess.<anonymous> (/vagrant/gulp_test_1/node_modules/gulp-ruby-sass/index.js:74:25)
    at ChildProcess.EventEmitter.emit (events.js:98:17)
    at maybeClose (child_process.js:743:16)
    at Process.ChildProcess._handle.onexit (child_process.js:810:5)

All other Sass stuff is working fine. It's just the mixins that raise an error.

I've installed Compass 0.12.2

Am I missing any gems/modules?

The system is running on Vagrant with an Ubuntu VM.

Upvotes: 0

Views: 1167

Answers (1)

Hichem ben chaabene
Hichem ben chaabene

Reputation: 145

@include should point to a mixin or a library that you import at the begginning of the same file.

You're missing and @import at the beginning and wherever left(10px); is coming from, if it's your own mixin or a compass library it has to be imported first.

Upvotes: 1

Related Questions