Gulp-useref抛出错误:"path必须是一个字符串"

Hal*_*ton 1 yeoman yeoman-generator gulp

我正在使用gulpfile.js由yeoman的gulp-webapp生成器生成并由我稍微修改以满足我的需求.出于某种原因,当我尝试运行构建过程(默认任务)时,我一直遇到问题.在'html'任务期间抛出错误,大多数错误引用都在`node_modules\gulp-useref\index.js'中.

这是错误输出:

stream.js:94
    throw er; //Unhandled stream in pipe.

TypeError: path must be a string
    at Object.fs.openSync (fs.js:427:18)
    at Object.fs.readFileSync (fs.js:284:15)
    at Transform.<anonymous> (C:\dev\project\node_modules\gulp-useref\index.js:54:44)
    at Array.forEach (native)
    at Transform.<anonymous> (C:\dev\project\node_modules\gulp-useref\index.js:50:31)
    at Array.forEach (native)
    at Transform.<anonymous> (C:\dev\project\node_modules\gulp-useref\index.js:41:36)
    at Array.forEach (native)
    at Transform._transform (C:\dev\project\node_modules\gulp-useref\index.js:38:23)
    at Transform._read (C:\dev\project\node_modules\gulp-useref\node_modules\through2\node_modules\readable-stream\lib\_stream_transform.js:184:10)
    at Transform._write (C:\dev\project\node_modules\gulp-useref\node_modules\through2\node_modules\readable-stream\lib\_stream_transform.js:172:12)
Run Code Online (Sandbox Code Playgroud)

这是HTML任务:

gulp.task('html', ['styles', 'scripts'], function () {
    var jsFilter = $.filter('**/*.js');
    var cssFilter = $.filter('**/*.css');

    return gulp.src(['app/**/*.html','app/**/*.php'])
        .pipe($.useref.assets())
        .pipe(jsFilter)
        .pipe($.uglify())
        .pipe(jsFilter.restore())
        .pipe(cssFilter)
        .pipe($.csso())
        .pipe(cssFilter.restore())
        .pipe($.useref.restore())
        .pipe($.useref())
        .pipe(gulp.dest('dist'))
        .pipe($.size());
});
Run Code Online (Sandbox Code Playgroud)

Hal*_*ton 7

简短回答:TypeError: path must be a string表示链接/脚本路径存在问题.useref无法找到您指向它的文件或目录.

答案
很长:我遇到了两个问题.

  1. 链接/脚本路径需要相对于gulpfile或具有要搜索的备用目录.
<!-- build:css /styles/main.css -->
<link href="app/styles/base.css">
<link href="app/styles/article.css">
<!-- endbuild -->
Run Code Online (Sandbox Code Playgroud)

要么

<!-- build:css(app) /styles/main.css -->
<link href="/styles/base.css">
<link href="/styles/article.css">
<!-- endbuild -->
Run Code Online (Sandbox Code Playgroud)
  1. yeoman gulpfile使用多个alt目录,要求你将它们放在花括号中,如下所示:
<!-- build:css({.temp,app}) /styles/main.css --> Works
Run Code Online (Sandbox Code Playgroud)

但是如果你只有一个alt目录而你将它留在花括号中则会引发错误.

<!-- build:css({app}) /styles/main.css --> TypeError: path must be a string
Run Code Online (Sandbox Code Playgroud)

这是因为它正在读取路径C:\path\to\project\{app}\styles\style.css.这对我来说似乎很奇怪.我认为无论长度如何,它都将遍历大括号中列出的目录.