【问题标题】:Gulp TypeError: Arguments to path.join must be stringsGulp TypeError:path.join 的参数必须是字符串
【发布时间】:2015-03-24 06:27:49
【问题描述】:

我对 gulp-ruby-sass 有疑问。当我尝试运行 watch 任务并更改一些 .sass 文件时,会出现错误:

TypeError: Arguments to path.join must be strings 

这是我的 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']);
})

我使用了 gulp-slash 但它不起作用。

【问题讨论】:

  • 您需要 gulp-watch 但不使用它。您确定这是发生问题的确切 gulpfile 吗?
  • 它在 Windows 上。为什么你说我没有使用 gulp-watch? gulp.task('watch', function() { gulp.watch('./sass/*.sass', ['sass']); }) 我的任务是看。当我评论 .pipe(sass()) 行时,问题不存在,但我还有另一个问题 - 我的 sass 没有编译为 css :)
  • gulp-watch 是一个单独的库。 gulp.watch 是 gulp 的一部分。您使用的是所有模块的最新版本吗?
  • 是的,我是。我不明白会发生什么
  • 你有什么版本的gulp-ruby-sass

标签: sass gulp gulp-watch


【解决方案1】:

gulp-ruby-sass 中的 syntax changes 从 1.0.0-alpha 开始,您需要使用 gulp-ruby-sass() 而不是 gulp.src() 从文件编译 Sass或目录。

如果您尝试在更新或最新版本中使用原始语法,您可能会遇到以下错误:

TypeError: Arguments to path.join must be strings

例如,0.7.x 及更早版本中使用 gulp.src() 的原始语法,现在已弃用:

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'));
});

1.x 中引入的新语法使用 gulp-ruby-sass() 作为 gulp 源适配器:

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

注意return语句第一行的区别。

另外请记住,在撰写本文时,使用 gulp-ruby-sass 1.0.0-alpha 时,还不支持 glob。

【讨论】:

  • 以防万一发生在其他人身上,请记住,您必须拥有 Sass >= 3.4,根据相同的 documentation
  • 可能对某人有所帮助:文件或 glob 模式(source/**/*.scss)进行编译。忽略带有下划线前缀的文件。 不支持目录来源。
【解决方案2】:

gulp-ruby-sass 1.0.0 版中的语法更改。看到这个问题:

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

新文档目前在这里:

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

这应该编译指定目录中的 sass 文件:

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

【讨论】:

  • 请将此作为评论添加到上述答案中。这是一个很好的补充。
【解决方案3】:

有点题外话,但在还想使用gulp-sourcemaps 的情况下,那里的各种文档有些过时了。要将rjb 的示例与源映射一起使用,您可以这样做

// 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'));
});

请注意,源映射的目标 arg './' 将计算为下面行中的文件夹 gulp.dest(...),实际上在这里,map-file 最终将位于 'path/to/css'

这归功于http://www.devworkflows.com/posts/getting-scss-auto-prefixer-and-source-map-to-play-nice/

【讨论】:

    猜你喜欢
    • 2015-03-31
    • 2017-02-23
    • 1970-01-01
    • 2016-11-30
    • 2020-05-05
    • 2017-05-06
    • 2019-11-04
    • 1970-01-01
    • 2020-12-01
    相关资源
    最近更新 更多