TypeScript system modules not registering imported file locations

Question

Problem

I'm using TypeScript v. 1.6.2 to compile my ts sources into js using ES5 and system modules. My expectation is for the JS to have a system.register populated with an array of strings that represent the imported source locations. For example:

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

However, in my case, system.register is empty. I'm not sure why it is empty, but I clearly cannot proceed without any imports. Below is a sketch of my file structure, example source code, and my tsconfig.json.

File Structure

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

Source

/// <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');
        
    }

}

Output

/// <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

I've got the same issue. The problem is, that you're using the type Bike only for declaration. You don't call anything on the class Bike (a static function for example) or passing Bike as a parameter or the like. Therefore there is no need for importing Bike in the compiled javascript file (at least from the compilers point of view or the typescript-team, who created the compiler)

But I found a solution for that: The compiler option emitDecoratorMetadata:true ensures that also Bike will be imported. Here the description from https://github.com/Microsoft/TypeScript/wiki/Compiler-Options:

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

I hope this helps.