TypeScript & SystemJS: angular ui router module not registered in transpiled js

Question

I'm writing an AngularJS app, with TypeScript as a transpiler and SystemJS for module loading. I'm trying to load the angular-ui-router module to configure the routing, but fail to do so. I get this error:

angular.js:38 Uncaught Error: [$injector:modulerr]

This is the script:

import * as angular from "angular";
import * as router from "angular-ui-router";

const app: angular.IModule = angular.module("my.website", ["ui.router"]);
app.config((stateProvider: router.IStateProvider) => {
    ...
});

This is how the script is transpiled:

System.register(["angular"], function(exports_1, context_1) {
...

As you can see, the angular-ui-router is not registered, and hence the module is not loaded. Why? What am I doing wrong?

For completeness: this is the SystemJS config:

System.config({
    defaultJSExtensions: true,
    map: {
        "angular": "https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js",
        "angular-ui-router": "https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.3.1/angular-ui-router.min.js"
    }
});

These are the relevant TypeScript settings:

"target": "es5",
"module": "system"

I have loaded the TypeScript definition files using typings.

Transpilation is done by gulp-typescript.

Any clues?

Answer 1

I managed to get it working by importing both the file and the module. Ugly as it may be, this works:

import * as angular from "angular";
import "angular-ui-router";
import * as router from "angular-ui-router";

const app: angular.IModule = angular.module("my.website", ["ui.router"]);
app.config((stateProvider: router.IStateProvider) => {
    ...
});