在编译sass时,Gulp抛出“TypeError:对path.join的参数必须是字符串”错误

时间:2015-02-01 20:39:09

标签: sass gulp

我正在关注Zoe Rooney的WordPress入门主题开发教程,但在命令行上运行“gulp styles”时遇到了这个特殊错误。

我的“gulpfile.js”如下:

//gulp plugins
var gulp = require('gulp');
var sass = require('gulp-ruby-sass');
    plumber = require('gulp-plumber'),
    autoprefixer = require('gulp-autoprefixer'),
    minifycss = require('gulp-minify-css'),
    newer = require('gulp-newer'),
    imagemin = require('gulp-imagemin'),
    livereload = require('gulp-livereload'),
    lr = require('tiny-lr'),
    server = lr();

//gulp tasks
gulp.task('styles', function(){
  return gulp.src(['scss/*.scss',
                   'scss/**/*.scss'], 
            {base: 'scss/'} )
      .pipe(plumber())
        .pipe(sass({ style: 'expanded' }))
        .pipe(gulp.dest(''))
        .pipe(autoprefixer('last 2 version', 'safari 5', 'ie 8', 'ie 9', 'opera 12.1', 'ios 6', 'android 4'))
        .pipe(minifycss())
        .pipe(gulp.dest('css'));
});

//gulp task images
var imgSrc = 'assets/images/originals/*';
var imgDest = 'assets/images';

gulp.task('images', function() {
  return gulp.src(imgSrc, {base: 'assets/images/originals'})
        .pipe(newer(imgDest))
        .pipe(imagemin({ optimizationLevel: 3, progressive: true, interlaced: true }))
        .pipe(gulp.dest(imgDest));
});

//default task
gulp.task('default', ['styles', 'images']);

// gulp watch
gulp.task('watch', function() {
  // Listen on port 35729
  server.listen(35729, function (err) {
      if (err) {
        return console.log(err);
      }

      // Watch .scss files
      gulp.watch('scss/*.scss', ['styles']);
      gulp.watch('scss/**/*.scss', ['styles']);
      gulp.watch('assets/images/originals/**', ['images']);

    });

});

我收到的错误信息如下:

Jonathans-MacBook-Pro:starter-theme Brain$ gulp styles
[15:33:59] Using gulpfile ~/Dropbox/Sites/neatpolish/wp-content/themes/starter-theme/gulpfile.js
[15:33:59] Starting 'styles'...
[15:33:59] 'styles' errored after 6.95 ms
[15:33:59] TypeError: Arguments to path.join must be strings
    at path.js:360:15
    at Array.filter (native)
    at Object.exports.join (path.js:358:36)
    at module.exports (/Users/Brain/Dropbox/Sites/neatpolish/wp-content/themes/starter-theme/node_modules/gulp-ruby-sass/index.js:65:15)
    at Gulp.imgSrc (/Users/Brain/Dropbox/Sites/neatpolish/wp-content/themes/starter-theme/gulpfile.js:19:15)
    at module.exports (/Users/Brain/Dropbox/Sites/neatpolish/wp-content/themes/starter-theme/node_modules/gulp/node_modules/orchestrator/lib/runTask.js:34:7)
    at Gulp.Orchestrator._runTask (/Users/Brain/Dropbox/Sites/neatpolish/wp-content/themes/starter-theme/node_modules/gulp/node_modules/orchestrator/index.js:273:3)
    at Gulp.Orchestrator._runStep (/Users/Brain/Dropbox/Sites/neatpolish/wp-content/themes/starter-theme/node_modules/gulp/node_modules/orchestrator/index.js:214:10)
    at Gulp.Orchestrator.start (/Users/Brain/Dropbox/Sites/neatpolish/wp-content/themes/starter-theme/node_modules/gulp/node_modules/orchestrator/index.js:134:8)
    at /usr/local/lib/node_modules/gulp/bin/gulp.js:129:20
Jonathans-MacBook-Pro:starter-theme Brain$ 

1 个答案:

答案 0 :(得分:0)

我使用相同的教程并让它发挥作用。

将其更改为:

gulp.task('styles', function() {
return sass('scss', { style: 'expanded' })
    .pipe(gulp.dest('scss'))
    .pipe(plumber())
    .pipe(autoprefixer('last 2 version', 'safari 5', 'ie 8', 'ie 9', 'opera 12.1', 'ios 6', 'android 4'))
    .pipe(minifycss())
    .pipe(gulp.dest(''))
});