Multiple files making up Type Script project

If you come like me from a C++ / C background and miss the .h (or .hpp) files, I have a way. And you don't have to change compiler flags, or use ///, or anything. Just plain simple .ts files, import, export.

You create a folder, name it "models"

In this folder, you can create your models, say:

automobile.ts

export class Automobile {...}

car.ts

import { Automobile } from './automobile.ts';

export class Car extends Automobile {...}

ferrari.ts

import { Automobile } from './automobile.ts';
import { Car } from './car.ts';

export class Ferrari extends Car {...}

and then the magic - header files!

you create a file called models.ts (could be header.ts, whatever) in the same folder, where you just do

export { Automobile } from './automobile.ts';
export { Car } from './car.ts';    
export { Ferrari } from './ferrari.ts';

now, in your other files, to import all your models

import * as x from 'src/app/models/models';

and be happy using

let myCar: x.Car = new x.Car();
let myFerrari: x.Ferrari = new x.Ferrari();

I wrote about getting the right set up for TypeScript and one of the ideas in there will help you - I originally got the idea from Mark Rendle.

The idea is that create a file named references.ts and have all of your dependencies listed in there. A bit like this:

/// <reference path="modulea.ts" />
/// <reference path="moduleb.ts" />
/// <reference path="modulec.ts" />
/// <reference path="moduled.ts" />
/// <reference path="modulee.ts" />

You can then simply reference this file at the top of all your TypeScript files:

/// <reference path="references.ts" />
module ModuleA {
    export class MyClass {
        doSomething() {
            return 'Hello';
        }
        tester() {
            var x = new ModuleB.MyClass();
        }
    }
}

The references.ts file acts like the References folder you have for a .NET project.

The other recommendation, which works quite well with this set up, is to use the --out flag to compile a single JavaScript file, starting with app.ts. The TypeScript compiler walks all the dependencies and works out the correct order for all the generated JavaScript.

tsc --out final.js app.ts

This strategy will scale with your program much better than manually referencing specific files everywhere.