javascript - ¿Cómo concatenar y minimizar una aplicación de Angular2?

Me gustaría concatenar y minimizar una aplicación de Angular2. Lo que hice fue primero concatenar todos mis archivos *.js (boot.js, application.js y luego todos los componentes) en un solo archivo y lo inserté en mi index.html. También eliminé el

<script>
        System.config({
            packages: {
                app: {
                    defaultExtension: 'js'
                }
            }
        });
        System.import('app/boot')
            .then(null, console.error.bind(console));
    </script>

y lo reemplacé con mi

<script src="js/allMyConcatFilesIntoOne.js"></script>

Pero recibí el error, que require falta/desconocido.

¿Cómo se rellenan las aplicaciones de Angular2 en un solo archivo? ¿Tengo que reunir primero todos los archivos TypeScript y luego concatenarlos y luego compilarlos usando gulp?

Saludos

Tenoda

Respuesta #1

Usa un gulpfile.js como este:

/// <binding Clean='clean' />
            "use strict";

            var gulp = require("gulp"),
                rimraf = require("rimraf"),
                concat = require("gulp-concat"),
                cssmin = require("gulp-cssmin"),
                uglify = require("gulp-uglify"),
                tsc = require("gulp-typescript");

            var webroot = "./wwwroot/";

            var paths = {
                js: webroot + "js/**/*.js",
                ts: webroot + "app/**/*.ts",
                minJs: webroot + "js/**/*.min.js",
                css: webroot + "css/**/*.css",
                minCss: webroot + "css/**/*.min.css",
                concatJsDest: webroot + "js/site.min.js",
                concatCssDest: webroot + "css/site.min.css"
            };

            gulp.task("clean:js", function (cb) {
                rimraf(paths.concatJsDest, cb);
            });

            gulp.task("clean:css", function (cb) {
                rimraf(paths.concatCssDest, cb);
            });

            gulp.task("clean", ["clean:js", "clean:css"]);

            gulp.task("min:js", function () {
                return gulp.src([paths.js, "!" + paths.minJs], { base: "." })
                    .pipe(concat(paths.concatJsDest))
                    .pipe(uglify())
                    .pipe(gulp.dest("."));
            });

            gulp.task("min:css", function () {
                return gulp.src([paths.css, "!" + paths.minCss])
                    .pipe(concat(paths.concatCssDest))
                    .pipe(cssmin())
                    .pipe(gulp.dest("."));
            });

            gulp.task("min", ["min:js", "min:css"]);