Gulp TypeError: Arguments to path.join must be strings

Question

I have i problem with gulp-ruby-sass. When i try to run the watch task and change some .sass files it occurs error:

TypeError: Arguments to path.join must be strings

Here is my gulpfile.js

var gulp = require('gulp');
var jade = require('gulp-jade');
var sass = require('gulp-ruby-sass');
var watch = require('gulp-watch');

gulp.task('sass', function() {
    return gulp.src('sass/*.sass')
        .pipe(sass())
                .pipe(gulp.dest('./css'));

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

I used gulp-slash but it don't works.

You're requiring `gulp-watch` but not using it. Are you sure this is the exact gulpfile that the problem occurs with? — Heikki, Jan 25 '15 at 19:35
it is on windows. why you say that i am not using gulp-watch? `gulp.task('watch', function() { gulp.watch('./sass/*.sass', ['sass']); })` there is my task for watch. when i comment the line `.pipe(sass())` the problem is absent, but i have another problem - my sass don't compile to css :) — Andrew Gnilitskiy, Jan 26 '15 at 08:37
`gulp-watch` is a separate library. `gulp.watch` is part of gulp. Are you using the latest versions of all modules? — Heikki, Jan 26 '15 at 09:32

score 82 · Accepted Answer · answered Jan 29 '15 at 18:02

With the syntax changes in gulp-ruby-sass starting from 1.0.0-alpha, you'll need to use gulp-ruby-sass() instead of gulp.src() to compile your Sass from a file or directory.

If you try to use the original syntax with newer or latest versions, you may encounter the following error:

TypeError: Arguments to path.join must be strings

For example, the original syntax in 0.7.x and earlier using gulp.src(), now deprecated:

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

// gulp-ruby-sass: 0.7.1
gulp.task('sass', function() {
    return gulp.src('path/to/scss')
        .pipe(sass({ style: 'expanded' }))
        .pipe(gulp.dest('path/to/css'));
});

The new syntax introduced in 1.x using gulp-ruby-sass() as a gulp source adapter:

// gulp-ruby-sass: 1.x
gulp.task('sass', function() {
    return sass('path/to/scss', { style: 'expanded' })
        .pipe(gulp.dest('path/to/css'));
});

Notice the difference in the first line of the return statement.

Also keep in mind, as of this writing when using gulp-ruby-sass 1.0.0-alpha, globs are not supported yet.

Just in case it happened to someone else, keep in mind that **you must have Sass >= 3.4**, according to the same [documentation](https://github.com/sindresorhus/gulp-ruby-sass/tree/rw/1.0#install). — Roberto S., Mar 06 '15 at 22:28
Might help someone: File or glob pattern (source/**/*.scss) to compile. Ignores files prefixed with an underscore. **Directory sources are not supported.** — Gonz, Nov 10 '16 at 22:57

Heikki · Answer 2 · 2015-01-27T08:11:36.033

6

gulp-ruby-sass syntax changes in version 1.0.0. See this issue:

https://github.com/sindresorhus/gulp-ruby-sass/issues/191

New docs are currently here:

https://github.com/sindresorhus/gulp-ruby-sass/tree/rw/1.0#gulp-ruby-sass-is-a-gulp-source-adapter

This should compile sass files in specified directory:

gulp.task('sass', function() {
    return sass('sass/')
        .pipe(gulp.dest('./css'));
});

edited Jan 27 '15 at 08:11

answered Jan 27 '15 at 07:36

Heikki

15,329
2
54
49

Please add this as a comment to the above answer. It's a nice addition. – n370 Mar 27 '15 at 19:00

score 1 · Answer 3 · edited May 23 '17 at 12:00

Slightly off-topic, but in the case of also wanting to use gulp-sourcemaps, the various documentation out there is somewhat outdated. To use rjb's example with sourcemaps, you would thus go

// gulp-ruby-sass: 1.x
gulp.task('sass', function() {
    return sass('path/to/scss', { style: 'expanded', sourcemap: true })
        .pipe(sourcemaps.init({loadMaps: true}))
        .pipe(sourcemaps.write('./'))
        .pipe(gulp.dest('path/to/css'));
});

Note that the destination arg for sourcemaps, './', will evaluate to the folder in the line below, gulp.dest(...), effectively here, map-file will end up in 'path/to/css'.

Credit for this goes to http://www.devworkflows.com/posts/getting-scss-auto-prefixer-and-source-map-to-play-nice/.

Gulp TypeError: Arguments to path.join must be strings

3 Answers3

Linked

Related