TypeScript - separating code output

Question

i'm trying typescript and I find it very useful.

I've a quite large project and i was considering rewriting it using typescript. The main problem here is the following:

file A.ts:

class A extends B {
    // A stuff
}

file B.ts:

class B {
    // B stuff
}

If I compile A.ts with this command:

tsc --out compiledA.js A.ts

I'll get error from the compiler cause he doesn't know how to threat the "B" after extends.

So, a "solution" would be including in A.ts (as first line of code):

/// <reference path="./B.ts" />

Compiling again A.ts with the same command

tsc --out compiledA.js A.ts

Will result in compiledA.js containing both B.ts and A.ts code. ( which could be very nice )

In my case, I only need to compile the A.ts code in the compiledA.js file and I don't want the B.ts stuff to be in there.

Indeed, what I want is:

• tsc --out A.js A.ts => compile only the A.ts stuff
• tsc --out B.js B.ts => compile only the B.ts stuff

I can do it by removing the "extends" keyword but doing that I'll loose most of the typescript goodness.

Can someone telll me if there's a way to do this ?

Answer 1

After some research I found out the problem was introduced by the --out argument in the compiler.

@silent__thought solution works just fine if you want to deal with modules. If you're not you'll need to use the require statement ( look at the question ) and then compile the "main.ts" file withouth the --out argument

Answer 2

EDIT: As Andrea points out, if you omit the --out parameter you will get the behavior expected, i.e. no combination of source files. I'll leave this alternative solution below incase it can help someone else.

---

I believe you will have to use the external module syntax (CommonJS or AMD) to do this.

Using your example:

a.ts

import B = module("b")

class A extends B.B {
    // A stuff
}

b.ts

export class B {
    // B stuff
}

Compile with tsc --out compiledA.js A.ts.

This results in a.js importing b.js using the CommonJS system. The resulting files look like this:

a.ts

var __extends = this.__extends || function (d, b) {
    function __() { this.constructor = d; }
    __.prototype = b.prototype;
    d.prototype = new __();
}
var B = require("./b")
var A = (function (_super) {
    __extends(A, _super);
    function A() {
        _super.apply(this, arguments);

    }
    return A;
})(B.B);

b.ts

var B = (function () {
    function B() { }
    return B;
})();
exports.B = B;