SystemJS Builder: minimize html and css during build

Question

SystemJS Builder: minimize html and css during build

I am learning how to use SystemJS Builder 0.15.30to link an application Angular 2 rc.6written in typescript 2. I use gulp 3.9.1to build:

Each component of my application has 5 files:

component.ts
component.html
component.scss
component.css (generated by gulp task number 1 below)
component.min.html (generated by gulp task number 2 below)

.tsimports .min.htmland .cssto be used inline. My goal is to minimize and link them in one step, instead of creating them first.

Currently, I have 3 gulp tasks that I would like to combine into one:

1. Scan all folders; translate .scssto mini .cssin the same directory

gulp.task('build-css', function () {
    gulp.src(appDev + '**/*.scss', {base: "./"})
        .pipe(postcss([precss, autoprefixer, cssnano]))
        .pipe(ext_replace('.css'))
        .pipe(gulp.dest('./'));
});

2. ; minify .html .min.html

gulp.task('shrink-html',function(){
    return gulp.src(appDev+'**/*.html', {base: "./"})
        .pipe(htmlmin({collapseWhitespace: true}))
        .pipe(ext_replace('.min.html'))
        .pipe(gulp.dest('./'));
});

. .css .min.html , typescript, .ts .js.

3 , SystemJS Builder. buildStatic :

// build-ts is run before this, to compile typescript into JS
// and move everything out to the production folder (appProd)
gulp.task('bundle',['build-ts'], function() {
    var builder = new Builder('', './systemjs.config.js');

    return builder
        .buildStatic(appProd + '/main.js', appProd + '/bundle.js')
});

, buildStatic() , .css .min.html.

. , fetch.

gulp.task('bundle',['build-ts'], function() {
    var builder = new Builder('', './systemjs.config.js');

    return builder
        .buildStatic(appProd + '/main.js', appProd + '/bundle.js', 
        {
            fetch: function (file, fetch) {
                if(file.name.search(/\/app.*\.html$/)!==-1){
                    console.log('html: '+ file.name);
                    //how to manipulate content and return minified HTML string?
                    return fetch(file);
                }else if (file.name.search(/\/app.*\.scss$/)!==-1){
                    console.log('scss: '+ file.name);
                    //how to manipulate content and return minified CSS string?
                    return fetch(file);
                }else{
                    return fetch(file);
                }                
            }
        });
});