Как собрать скрипты и стили useref и wiredep, еще и захешировать gulp-hash?

Question

[HamSter]

gulpfile.js:

'use strict';

var gulp         = require('gulp'),
    jade         = require('gulp-jade'),    
    sass         = require('gulp-sass'),
    minifyCss    = require('gulp-minify-css'),
    uncss        = require('gulp-uncss'),
    useref       = require('gulp-useref'),
    hash         = require('gulp-hash'),
    replace      = require('gulp-replace'),
    wiredep      = require('wiredep').stream;

// Пути
var path = {
    app : {          // Исходники
        html   : 'dist/*.html',
        jade   : 'app/*.jade',
        js     : 'app/js/**/*.js'       
    },
    dist : {         // Релиз
        html   : 'dist/',       
        js     : 'dist/js/'
    },
    watch : {        // Наблюдение
        jade   : 'app/**/*.jade',
        html   : 'dist/**/*.html',
        js     : 'app/js/**/*.js'   
    }
};

// Работа с JADE
gulp.task('jade', function() {  
    gulp.src(path.app.jade)
        .pipe(jade({
            pretty: '\t',
        }))        
        .pipe(gulp.dest(path.dist.html));
});

// Работа с HTML
gulp.task('html', ['js'], function(){
    var assets = require('./tmp/assets.json');
    gulp.src(path.app.html)
        .pipe(wiredep())        
        .pipe(replace('main.js', assets['main.js']))
        .pipe(useref())         
        .pipe(gulp.dest(path.dist.html));
});

// Работа с JS
gulp.task('js', function(){
    return gulp.src(path.app.js)
        .pipe(hash())
        .pipe(gulp.dest(path.dist.js))
        .pipe(hash.manifest('assets.json')) 
        .pipe(gulp.dest('tmp'));
});

// Наблюдение
gulp.task('watch', function () {    
    gulp.watch(path.watch.jade, ['jade']); 
    gulp.watch(path.watch.html, ['html']);
    gulp.watch(path.watch.js, ['js']); 
});

// Задачи по-умолчанию
gulp.task('default', [  
    'jade', 
    'html',
    'js'
]);

Структура проекта: * как должно быть

- app
  |__ bower
  |    |__ jquery ...
  |__ js
  |    |__ main.js
  |    |__ plugin.js
  |__ index.jade
- dist
  |__ js
  |    |__ main-0aff1519.js
  |    |__ vendor-0aff1519.js
  |__ index.html

index.jade:

... 

body   

    block content

    //- Сбор js ф-ов установленных bower в один - vendor.js
    // build:js js/vendor.js
    // bower:js
    // endbower
    // endbuild        

    //- Сбор js ф-ов в один - main.js
    // build:js js/main.js
    script(src='js/main.js')
    script(src='js/plugin.js')
    // endbuild

Вопрос:

--> Как исправить .pipe(replace('main.js', assets['main.js'])), чтобы "хэшировались" все файлы в js папке?

--> Как произвести правильную сборку в index.jade\gulpfile.js

// build:js js/main.js
script(src='js/main.js')
script(src='js/parallax.min.js')
// endbuild

?

Потому как на данный момент выдает ошибку:

Error: File not found with singular glob: C:\Users\Хомка\desktop\test\dist\js\parallax.min.js

Вообщем что-то запуталась, может быть кто-то сможет помочь понять, что исправить!

Answer 1

[HamSter]

Если кому-нибудь нужно, то решила проблему плагином gulp-replace-assets.

Полная сборка теперь выглядит так.