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任务中添加的顺序单独加载,应用程序正常运行。