TypeScript 系统模块未注册导入的文件位置

Question

问题

我正在使用 TypeScript v. 1.6.2 使用 ES5 和 system 模块将我的 ts 源代码编译成 js。我的期望是 JS 有一个 system.register 填充了一个字符串数组，代表导入的源位置。例如:

System.register(['angular2/angular2', 'angular2/router', 'angular2/http'], 
    function(exports_1) { ...

但是，在我的例子中，system.register 是空的。我不确定为什么它是空的，但我显然无法在没有任何进口的情况下继续进行。下面是我的文件结构、示例源代码和我的 tsconfig.json 的草图。

文件结构

  |index.js
  |
  |components
     |
     |--Bike
        |
        -Bike.ts

来源

/// <reference path="components/Bike/Bike.ts" />

import { Bike } from 'components/Bike/Bike';

export class TestClass {
    
    public bike: Bike;
    
    constructor(bike: Bike) {
        
        this.bike = bike;

        console.log('Bike new TestClass');
        
    }
        
}

...

export class Bike {

    constructor() {
    
        console.log('new bike');
        
    }

}

输出

/// <reference path="components/Bike/Bike.ts" />

  //NOTICE - no locations in the registry!

System.register([], function(exports_1) {
    var TestClass;
    return {
        setters:[],
        execute: function() {
            TestClass = (function () {
                function TestClass(bike) {
                    this.bike = bike;
                    console.log('Bike new TestClass');
                }
                return TestClass;
            })();
            exports_1("TestClass", TestClass);
        }
    }
});

tsconfig.json

{
    "compilerOptions": {
        "target": "es5",
        "module": "system",
        "declaration": true,
        "removeComments": false,
        "emitDecoratorMetadata": true,
        "experimentalDecorators": true,
        "listFiles": true,
        "outDir": "target/js"
    },
    "exclude": [
        "node_modules",
        "jspm_packages",
        "bower_components",
        "d3",
        "plottable",
        "angular2",
        "target"
    ]
}

Answer 1

我也遇到了同样的问题。问题是，您仅将 Bike 类型用于声明。您不会在类 Bike 上调用任何东西(例如静态函数)或将 Bike 作为参数等传递。因此，无需在编译的 javascript 文件中导入 Bike(至少从编译器或创建编译器的 typescript 团队的角度来看)

但我找到了一个解决方案:编译器选项 emitDecoratorMetadata:true 确保 Bike 也将被导入。这里的描述来自https://github.com/Microsoft/TypeScript/wiki/Compiler-Options :

Emit design-type metadata for decorated declarations in source. See issue #2577 for details.

希望对您有所帮助。