TypeScript - Namespaces - multiple files using reference path

In our previous blogpost:  https://sashankexpresstech.blogspot.com/2018/11/typescript-namespaces-multiple-files.html ... we have explored how to split a namespace into multiple files and compile them. In both the techniques mentioned, work done to use the files becomes tedious. TypeScript has one more technique to address this issue using reference path

Technique 03:

In our app.ts file, let us include the first two lines mentioned below:

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

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

console.log(myArea.circleArea(5));

console.log(myArea.squareArea(5));

The triple slash mentioned above is a comment. The contents of the comment are used as a compiler directives. They can only be contained in the top of the containing file. For more information, let us refer the following link:
https://www.typescriptlang.org/docs/handbook/triple-slash-directives.html

Now, after we save our app.ts file - let us compile the file by using the following command:
$ tsc app.ts --outFile app.js

Let us start the webserver and then open the address: localhost:3000 in our web browser.

$ python -m SimpleHTTPServer 3000
Serving HTTP on 0.0.0.0 port 3000 ...
127.0.0.1 - - [16/Nov/2018 06:08:47] "GET / HTTP/1.1" 200 -
127.0.0.1 - - [16/Nov/2018 06:08:48] "GET /app.js HTTP/1.1" 200 -

Output in browser console:
78.53981633974483
25

This technique appears to be the most convenient way to include the namespace in multiple files and compiling them for usage.

Reference:

• https://www.typescriptlang.org/docs/handbook/triple-slash-directives.html
• https://www.typescriptlang.org/docs/handbook/namespaces-and-modules.html#pitfalls-of-namespaces-and-modules