请问gulp怎么样配置前端目录结构？

Question

请问如何搭建
dist
|--- css
|--- img
|--- js
|--- fonts
src
|--- scss
|--- img
|--- js
|--- fonts
gulpfile.js
结构？
因为fonts和img文件基本上是不变动的（img就原图，不用imagemini压缩）。
就是说先要把src下的fonts目录和img目录复制到dist/下面。
仆的代码：

var gulp = require("gulp");
var sass = require("gulp-sass");
// 复制静态资源
var staticfolder = [];
var fonts = {
    dist: "dist/fonts/",
    src: "src/fonts/**/*"
}
var img = {
    dist: "dist/img/",
    src: "src/img/**/*"
}
staticfolder = [fonts, img];
gulp.task("static", function () {
    staticfolder.forEach(function (item) {
        gulp.src(item.src).pipe(gulp.dest(item.dist));
    })
});

gulp.task("static:watch", function () {
    var folder = staticfolder.map(function (item) {
        return item.src
    });
    gulp.watch(folder, ["static"])
})

gulp.task("default", ["static:watch"]);

这样的代码在新增的时候还没问题，但是在重命名和删除文件的时候就会遇到问题。
在删除的时候，watch可能会报错，不会同步去删除dist的，然后直接退出watch（重命名跟删除差不多，是一样的问题）。

删除时报错提示：
[13:28:04] Finished 'static' after 4.55 ms
events.js:160
      throw er; // Unhandled 'error' event
      ^

Error: Error watching file for changes: EPERM
    at exports._errnoException (util.js:953:11)
    at FSEvent.FSWatcher._handle.onchange (fs.js:1400:11)

D:\www\gulp\001>

而且还有一个问题，就是我每次变动img目录或者fonts目录都会重新把这些静态资源全部重新复制一遍到dist下，所以我感觉这样不是很科学。请问怎么只复制相应改动的部分呢？

Answer 1

装merge-stream吧，npm install --save-dev merge-stream，然后代码改改：

var gulp = require("gulp");
var sass = require("gulp-sass");
var merge = require('merge-stream');
// 复制静态资源
var staticfolder = [];
var fonts = {
    dist: "dist/fonts/",
    src: "src/fonts/**/*"
}
var img = {
    dist: "dist/img/",
    src: "src/img/**/*"
}
staticfolder = [fonts, img];
gulp.task("static", function () {
    var streams = staticfolder.map(function (item) {
        return gulp.src(item.src).pipe(gulp.dest(item.dist));
    })
    return merge.apply(null, streams);
});

gulp.task("static:watch", function () {
    var folder = staticfolder.map(function (item) {
        return item.src
    });
    gulp.watch(folder, ["static"])
})

gulp.task("default", ["static:watch"]);

应该就好了

Answer 2

这种将文件夹复制到 dist 中的功能，最好不要直接使用 pipe 来完成，用同步比较好，比如，可以考虑使用 gulp-files-sync，指定源路径，再指定目的路径就行了。非常方便，而且是只同步修改的部分。

另外还有个gulp-file-sync，功能也类似。