如何使用SystemJS禁用加载* .ts文件

Question

我正在尝试使用此guide

构建我的第一个A2应用

一切正常，但我收到js和ts文件，如下面的屏幕截图所示：

1. 是否可以不加载* .ts文件？

2. 是否可以将供应商文件合并为一个？目前App正在加载大约40个req​​。

以下配置文件：

tsconfig

{
  "compilerOptions": {
    "target": "es5",
    "module": "system",
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "removeComments": false,
    "noImplicitAny": false,
    "sourceMap": true
  },
  "exclude": [
    "node_modules"
  ]
}

systemjs.config

(function (global) {
  var map = {
    'app': 'app', // 'dist',
    '@angular': 'node_modules/@angular',
    'angular2-in-memory-web-api': 'node_modules/angular2-in-memory-web-api',
    'rxjs': 'node_modules/rxjs'
  };
  var packages = {
    'app': { main: 'app.boot', defaultExtension: 'js' },
    'rxjs': { defaultExtension: 'js' },
    'angular2-in-memory-web-api': { main: 'index.js', defaultExtension: 'js' }
  };
  var ngPackageNames = [
    'common',
    'compiler',
    'core',
    'forms',
    'http',
    'platform-browser',
    'platform-browser-dynamic',
    'router',
    'router-deprecated',
    'upgrade'
  ];
  function packIndex(pkgName) {
    packages['@angular/' + pkgName] = { main: 'index.js', defaultExtension: 'js' };
  }
  function packUmd(pkgName) {
    packages['@angular/' + pkgName] = { main: 'bundles/' + pkgName + '.umd.js', defaultExtension: 'js' };
  }
  var setPackageConfig = System.packageWithIndex ? packIndex : packUmd;
  ngPackageNames.forEach(setPackageConfig);
  var config = {
    map: map,
    packages: packages,
    transpiler: 'none',
    defaultJSExtensions: true
  };
  System.config(config);
})(this);

Answer 1

1）它实际上并没有加载TS文件。因为您正在生成源映射，所以浏览器知道如何建立连接，这反过来又使您更容易开发。

2）我会看看Ionic框架并模仿他们使用Browserify做的很多事情。我用它来构建我的前端。它将所有JS合并到一个文件中，如果你告诉它做一个发布版本，那么就缩小一切。就像Madhu说的那样，它使用了Gulp。

Answer 2

快速入门指南只是为了帮助您开始使用基本应用程序。

如果您想使用生产就绪应用程序，您必须投资创建持续集成包，可能正在使用Gulp \ Grunt任务运行器。

Angular团队还为这个名为Angular CLI

的界面提供了一个非常好的界面

有关如何使用它的详细说明，请参见here on Angular CLI Github repo

希望这会有所帮助!!