Gulp `build` not working as expected, gives only `index.html` as output

Question

I am packing my application using gulp. But I am getting only the index.html as a out put.

I am not able to see vendar.js,app.js files with all css files added in the index.html file.

my expectation is :

get all files from index.html href and src. from there compress as per serial what it's there in index file and send to dest folder.

here is my code:

var gulp = require("gulp");
var ghtmlSrc = require('gulp-html-src');
var templateCache = require("gulp-angular-templatecache");
var gulpif = require('gulp-if');
var ngAnnotate = require('gulp-ng-annotate');
var minifyCss = require('gulp-minify-css');
var useref = require('gulp-useref');
var uglify = require('gulp-uglify');

gulp.task('templates', function() {
    return gulp.src('./WebContent/src/**/*.html')
    .pipe(templateCache({
        root:'src/',
        module: 'newPCSApp.templates',
        standalone: true
    }))
    .pipe(gulp.dest('WebContent/src/app/'));
});

gulp.task('compress', function() {
            return gulp.src('./WebContent/index.html')
            .pipe(useref())
            .pipe(gulpif('*.js', ngAnnotate()))
            .pipe(gulpif('*.js', uglify({ mangle: false })))
            .pipe(gulpif('*.css', minifyCss()))
            .pipe(gulp.dest('./dist'));
        });


gulp.task('build',['templates', 'compress' ]);

Answer 1

after I added the comment line in to html file, the issue fixed.

<!--build:css css/style.min.css --> <!-- endbuild --> <!-- build:js js/vendor.min.js --> <!-- endbuild --> <!-- build:js js/app.min.js --> <!-- endbuild -->