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

in my case, system.register is empty. I'm not sure why it is empty,

你只得到你import。

例如要获得 angular2/angular2 作为依赖项，您需要像这样的东西：

import * as angular2 from "angular2/angular2";

Answer 2

我遇到了同样的问题。问题是，您仅将类型 Bike 用于声明。您不会在 class Bike 上调用任何内容（例如静态函数）或将 Bike 作为参数等传递。因此，不需要在编译后的 javascript 文件中导入 Bike（至少从编译器或创建编译器的打字稿团队的角度来看）

但我找到了一个解决方案：编译器选项 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.

希望对您有所帮助。

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

TypeScript system modules not registering imported file locations

typescript

systemjs

typescript1.6

问题