从systemjsbuilder中排除我的angular2 rc应用程序文件

Question

我想创建一个带有angular2依赖项的js文件，但不包括我的应用程序js文件。

因为在对ts文件（例如我的clientList.component.ts）进行的每一次更改中，我都必须重新构建捆绑包。

这是我的任务：

gulp.task('bundle:angular', function () {
var builder = new Builder('', './systemjs.config.js');
return builder
    .buildStatic('./wwwroot/ngApp/main.js', './wwwroot/js/libs/angular.bundle.js',
                        { minify: true, sourceMaps: true})
    .then(function (output) {
        console.log('Build complete');
    })
    .catch(function (err) {
        console.log('Build error');
    });
});

这是我的systemjs.config.js

(function (global) {
    var map = {
        'app': './wwwroot/ngApp',
        'rxjs': './wwwroot/js/libs/rxjs',
        '@angular': './wwwroot/js/libs/@angular'
    };
    var packages = {
         'app': { main: 'main.js', defaultExtension: 'js' },
          'rxjs': { defaultExtension: 'js' }
    };
    var packageNames = [
         '@angular/common',
         '@angular/compiler',
         '@angular/core',
         '@angular/http',
         '@angular/platform-browser',
         '@angular/platform-browser-dynamic',
         '@angular/router',
         '@angular/router-deprecated',
         '@angular/testing',
         '@angular/upgrade'
    ];
  packageNames.forEach(function (pkgName) {
     packages[pkgName] = { main: 'index.js', defaultExtension: 'js' };
  });
  var config = {
     map: map,
     packages: packages
  }
   if (global.filterSystemConfig) { global.filterSystemConfig(config); }
   System.config(config);
 })(this);

感谢

Answer 1

这样就可以了，

gulp.task('bundle:angular', function () {
var builder = new Builder('', './systemjs.config.js');
return builder
    .buildStatic('./wwwroot/ngApp/main.js - @angular', './wwwroot/js/libs/angular.bundle.js',
                        { minify: true, sourceMaps: true})
    .then(function (output) {
        console.log('Build complete');
    })
    .catch(function (err) {
        console.log('Build error');
    });
});

Answer 2

您正在为应用程序制作一个静态捆绑包（即可以由<script>直接加载的捆绑包），其中包括所有依赖项，因此是有角度的。要将你的应用程序与angular（或任何其他库）分离，你必须通过创建一个require所有依赖项的文件来构建供应商捆绑包。应用程序捆绑包必须是应用程序及其依赖项和供应商捆绑包之间的区别。

https://github.com/systemjs/builder#example---普通束

然而，如果您想要的是更改源文件后的周转时间，我建议您查看webpack。它有创建delta捆绑包的插件，并且有了webpack开发服务器，它可以非常快速地重建已经发生的变化（在我的设置中大约需要2秒）。我不认为使用SystemJS可以获得类似的快速周转时间。