Javascript typescript未生成正确的system.register

所以，我的问题是：

我的应用程序文件结构如下：

当I it tsc时，会生成相同的结构，但在dist目录下

编译配置设置如下：

{
    "compilerOptions": {
        "noImplicitAny": true,
        "target": "es5",
        "outDir":"dist",
        "module": "system", //commonjs, amd ( requirejs ) , system
        "moduleResolution": "node",
        "sourceMap": true,
        "emitDecoratorMetadata": true,
        "experimentalDecorators": true,
        "removeComments": false

    }
} 

  System.config({
         baseURL : "dist",  
      });

      System.import('Application.js')
            .then(null, console.error.bind(console));

import {SelectedProducts} from "./Controllers/SelectedProducts";

export class Application  {

    constructor(private controller:SelectedProducts){

    }
 // some methods here

 }

System.register([], function(exports_1, context_1) {
    "use strict";
    var __moduleName = context_1 && context_1.id;
    var Application;
    return {
        setters:[],
        execute: function() {
            Application = (function () {
                function Application(controller) {
                    this.controller = controller;
                }
  // methods go here

       }());
            exports_1("Application", Application);
        }
    }
});

我正在index.html上加载带有Systemjs的模块，如下所示：

{
    "compilerOptions": {
        "noImplicitAny": true,
        "target": "es5",
        "outDir":"dist",
        "module": "system", //commonjs, amd ( requirejs ) , system
        "moduleResolution": "node",
        "sourceMap": true,
        "emitDecoratorMetadata": true,
        "experimentalDecorators": true,
        "removeComments": false

    }
} 

  System.config({
         baseURL : "dist",  
      });

      System.import('Application.js')
            .then(null, console.error.bind(console));

import {SelectedProducts} from "./Controllers/SelectedProducts";

export class Application  {

    constructor(private controller:SelectedProducts){

    }
 // some methods here

 }

System.register([], function(exports_1, context_1) {
    "use strict";
    var __moduleName = context_1 && context_1.id;
    var Application;
    return {
        setters:[],
        execute: function() {
            Application = (function () {
                function Application(controller) {
                    this.controller = controller;
                }
  // methods go here

       }());
            exports_1("Application", Application);
        }
    }
});

Application.ts文件如下所示：

{
    "compilerOptions": {
        "noImplicitAny": true,
        "target": "es5",
        "outDir":"dist",
        "module": "system", //commonjs, amd ( requirejs ) , system
        "moduleResolution": "node",
        "sourceMap": true,
        "emitDecoratorMetadata": true,
        "experimentalDecorators": true,
        "removeComments": false

    }
} 

  System.config({
         baseURL : "dist",  
      });

      System.import('Application.js')
            .then(null, console.error.bind(console));

import {SelectedProducts} from "./Controllers/SelectedProducts";

export class Application  {

    constructor(private controller:SelectedProducts){

    }
 // some methods here

 }

System.register([], function(exports_1, context_1) {
    "use strict";
    var __moduleName = context_1 && context_1.id;
    var Application;
    return {
        setters:[],
        execute: function() {
            Application = (function () {
                function Application(controller) {
                    this.controller = controller;
                }
  // methods go here

       }());
            exports_1("Application", Application);
        }
    }
});

生成的Application.js文件如下所示：

{
    "compilerOptions": {
        "noImplicitAny": true,
        "target": "es5",
        "outDir":"dist",
        "module": "system", //commonjs, amd ( requirejs ) , system
        "moduleResolution": "node",
        "sourceMap": true,
        "emitDecoratorMetadata": true,
        "experimentalDecorators": true,
        "removeComments": false

    }
} 

  System.config({
         baseURL : "dist",  
      });

      System.import('Application.js')
            .then(null, console.error.bind(console));

import {SelectedProducts} from "./Controllers/SelectedProducts";

export class Application  {

    constructor(private controller:SelectedProducts){

    }
 // some methods here

 }

System.register([], function(exports_1, context_1) {
    "use strict";
    var __moduleName = context_1 && context_1.id;
    var Application;
    return {
        setters:[],
        execute: function() {
            Application = (function () {
                function Application(controller) {
                    this.controller = controller;
                }
  // methods go here

       }());
            exports_1("Application", Application);
        }
    }
});

有人知道为什么会这样吗

这不是system.register不符合预期的唯一情况

我的ProductsController.ts也生成错误：

ProductsController.ts来源：

import {ProductsRepository} from "../Models/ProductsRepository";
import {EditProductView} from "../Views/EditProductView";
import {ListProductsView} from "../Views/ListProductsView";
import {Product} from "../Models/Product";
import {ProductsViewModel} from "../Views/ProductsViewModel";
import {ValidationProvider} from "../Validation/ValidationProvider";

export class SelectedProducts {

    public constructor(private productsRepository:ProductsRepository, 
    private editView:EditProductView,
    private listSelectedView:ListProductsView,
    private validation:ValidationProvider){

    } 
// some methods here

}

js生成的代码：

System.register(["../Models/Product", "../Views/ProductsViewModel"], function(exports_1, context_1) {
    "use strict";
    var __moduleName = context_1 && context_1.id;
    var Product_1, ProductsViewModel_1;
    var SelectedProducts;
    return {
        setters:[
            function (Product_1_1) {
                Product_1 = Product_1_1;
            },
            function (ProductsViewModel_1_1) {
                ProductsViewModel_1 = ProductsViewModel_1_1;
            }],
        execute: function() {
            SelectedProducts = (function () {
                function SelectedProducts(productsRepository, editView, listSelectedView, validation) {
                    this.productsRepository = productsRepository;
                    this.editView = editView;
                    this.listSelectedView = listSelectedView;
                    this.validation = validation;
                }

            }());
            exports_1("SelectedProducts", SelectedProducts);
        }
    }
});

---

有什么想法吗

在TypeScript中，未用作值的模块导入将从输出中删除。理性的做法是，您可以在设计时使用模块中的类型，但不打算将其用作运行时依赖项。在本例中，

SelectedProducts

的唯一用途是作为构造函数参数的类型注释

使用

导入“/Controllers/SelectedProducts”以确保模块导入被保留

有关模块导入省略的更多信息，请参阅