Question

我的gulp版本中存在以下问题。在一个任务中，我为每个文件夹创建精灵文件，然后运行编译使用spritesmith sass文件的sass文件的任务。我收到以下错误：

错误：要导入的文件未找到或不可读：sprites / x

注意：x是ASSETS_SPRITE_SRC中我的文件夹的名称

这是我的spritesmith任务

    export = function buildAssets(gulp, plugins, option) {
      return function () {
      var folders = getFolders(ASSETS_SPRITE_SRC);
      folders.map(function(folder) {
          var spriteData = gulp.src(path.join(ASSETS_SPRITE_SRC, folder, '/*.*'))
              .pipe(plugins.spritesmith({
                  imgName: folder + '.png',
                  cssName: folder + '.scss'
              }));
          spriteData.img.pipe(gulp.dest(ASSETS_SPRITE_DEST));
          spriteData.css.pipe(gulp.dest(STYLE_SRC + '/sprites'));
      });
      return gulp.dest(STYLE_SRC + '/sprites');
  };
}

function getFolders(dir) {
    return fs.readdirSync(dir)
        .filter(function(file) {
            return fs.statSync(path.join(dir, file)).isDirectory();
        });
}

受到启发：https://github.com/gulpjs/gulp/blob/master/docs/recipes/running-task-steps-per-folder.md

这是我的sass任务

export = function buildSassDev(gulp, plugins, option) {
    return function () {
        return gulp.src(join(STYLE_SRC, '**', '*.scss'))
            .pipe(plugins.sass().on('error', plugins.sass.logError))
            .pipe(gulp.dest(CSS_DEST));
    }; }

我首先运行buildAssets，然后运行buildSassDev。

我错了什么？

Answer 1

我终于找到了我错的地方。我需要合并spriteData.img.pipe和spriteData.css.pipe以确保它们都没问题。

这是正确的代码：

export = function buildAssets(gulp, plugins, option) {
return function () {
    var folders = getFolders(ASSETS_SPRITE_SRC);
    var tasks = folders.map(function (folder) {
        var spriteData = gulp.src(path.join(ASSETS_SPRITE_SRC, folder, '/*.*'))
            .pipe(plugins.spritesmith({
                imgName: folder + '.png',
                cssName: folder + '.scss'
            }));
        var imgStream = spriteData.img.pipe(gulp.dest(ASSETS_SPRITE_DEST));
        var cssStream = spriteData.css.pipe(gulp.dest(STYLE_SRC + '/sprites'));
        return merge(imgStream, cssStream);
    });
    return merge(tasks);
};

}

与spritesmith和sass编译吞咽

1 个答案: