如何使用Gulp安全地缩小Angular 2 Typescript应用程序?

时间:2016-03-15 15:06:03

标签: javascript gulp angular systemjs

Angular 2应用程序如何安全地缩小生产?

应用程序正在使用SystemJS进行模块加载,并且它还配置为使用 gulp-typescript 进行Typescript编译操作。

以下是用于缩小的Gulp任务配置:

gulp.task('min:js', ['compile:ts'], function () {
return gulp.src([
    './node_modules/es6-shim/es6-shim.js',
    './node_modules/systemjs/dist/system-polyfills.js',
    './node_modules/angular2/es6/dev/src/testing/shims_for_IE.js',
    './node_modules/angular2/bundles/angular2-polyfills.js',
    './node_modules/systemjs/dist/system.src.js',
    './node_modules/rxjs/bundles/Rx.js',
    './node_modules/angular2/core.js',
    './node_modules/angular2/http.js',
    './node_modules/angular2/router.js',
    './node_modules/material-design-lite/material.js',

    './app/**/*.js',
    '!./app/' + packageName + '.min.js'])
.pipe(concat(packageName + '.js'))
.pipe(uglify())
.pipe(rename({
    suffix: '.min'
}))
.pipe(gulp.dest('./app/'));
});

此任务的结果是非安全缩小代码,导致:

未捕获的ReferenceError:未定义require

index.html中的SystemJS配置是:

System.config({
    packages: {
      app: {
        format: 'register',
        defaultExtension: 'js'
      }
    }
  });
  System.import('app/[package name here]')
        .then(null, console.error.bind(console));

并且文件按照在gulp任务中添加的顺序单独加载,应用程序正常运行。

0 个答案:

没有答案