Gulp TypeError: Arguments to path.join must be strings
Solution 1
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.
Solution 2
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'));
});
Solution 3
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/.
Related videos on Youtube
Andrew Gnilitskiy
Updated on May 31, 2020Comments
-
Andrew Gnilitskiy almost 4 years
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.
-
Heikki over 9 yearsYou're requiring
gulp-watch
but not using it. Are you sure this is the exact gulpfile that the problem occurs with? -
Andrew Gnilitskiy over 9 yearsit 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 :) -
Heikki over 9 years
gulp-watch
is a separate library.gulp.watch
is part of gulp. Are you using the latest versions of all modules? -
Andrew Gnilitskiy over 9 yearsyes, i am. and i don't understand what happens
-
Heikki over 9 yearsWhat version of
gulp-ruby-sass
do you have? -
Andrew Gnilitskiy over 9 years
"gulp-ruby-sass": "^1.0.0-alpha"
-
-
Roberto S. about 9 yearsJust in case it happened to someone else, keep in mind that you must have Sass >= 3.4, according to the same documentation.
-
n370 about 9 yearsPlease add this as a comment to the above answer. It's a nice addition.
-
Gonz over 7 yearsMight help someone: File or glob pattern (source/**/*.scss) to compile. Ignores files prefixed with an underscore. Directory sources are not supported.