gulp编译jade后怎么能按目录的生成相应目录的html？

Question

比如gulp编译/jade/main/index.jade，能生成在html/main/index.html。 以下是我写的gulp的配置，它不能按目录生成html，只能统一生成在/src/目录下，求大神帮忙了！
现在的配置如下：

$gulp.task('html', function () {
    return $gulp.src([
        '!share/jade/compoments/_*.jade',//不编译组件文件
        'share/jade/**/*.jade'//编译页面文件
    ]).pipe($jade({
        pretty: '\t'
    })).pipe($gulp.dest('var/build'));//输出到var/build文件夹下
});

我的jade目录如下：

jade>
    compoments>
        _header.jade
        _sidebar.jade
    pages>
        cartoon>
            huoying.jade
        movie>
            superman.jade
        music>
            taylor.jade
        main>
            index.jade
            about.jade
        

有好的解决办法吗！

Answer 1

首先，你的gulp写法还存在点问题，gulp.src()参数如果是数组，!表示排除模式，但是不能在数组中的第一个元素中使用排除模式。那样是不生效的。比如：

gulp.src([*.js,'!b*.js']) //匹配所有js文件，但排除掉以b开头的js文件
gulp.src(['!b*.js',*.js]) //不会排除任何文件，因为排除模式不能出现在数组的第一个元素中

建议看一下我的这篇文章：http://jafeney.com/2016/03/06/20160306-gulp/，这里详细地介绍了gulp的用法

还有建议这样写gulp任务：

var gulp = require('gulp'),                         // gulp核心模块
    DEST = 'public',                                // 编译目录
    CSS_DEST = 'public/css',                        // css编译目录
    JS_DEST = 'public/js',                          // js编译目录
    IMG_DEST = 'public/img',                        // img编译目录
    HTML_DEST = 'var/build',                        // html编译目录
    WEB_PORT = 9000,                                // 服务器监听的端口
    $ = require('gulp-load-plugins')();             // gulp插件加载模块

// .... 其他代码省略掉了


// ---- 这里是你要的： 处理html ------
gulp.task('htmls', function() {
    return gulp.src(['share/jade/**/*.jade','!share/jade/compoments/_*.jade'])
        .pipe($.jade({pretty: '\t'}))
        // 压缩html (不要这个功能的话可以去掉)
        .pipe($.rename({
            suffix: '.min',
            extname: '.html'
        }))
        .pipe($.minifyHtml())
        .pipe(gulp.dest(HTML_DEST))
});

如果还有疑问，发我邮件 [e-mail]