What is difference between compiling TypeScript to seperate modules or a single file?

Question

Besides the obvious (hah).

I'm still no sure why you would choose either of those.

I used to think compiling a single file was easier, as you use <reference>s to link files and can use nested modules to manage a global namespace.

But now I'm thinking that import/require and many output files might be good for greater modularity (and similarity to regular JavaScript / ES6).

But can you namespace types adequately using imports? Using extra level of modules seems awkward when importing.

And won't we still need <references> to resolve the type annotations?

How do I decide on this?

Have you read this? It covers most of your questions typescript.codeplex.com/… — Ryan Cavanaugh
– Ryan Cavanaugh, Commented Feb 26, 2014 at 4:33
just thought I'd share this as well ;) youtube.com/watch?v=KDrWLMUY0R0&hd=1 — basarat
– basarat, Commented Feb 26, 2014 at 8:02
Thanks for the link to the manual, I wasn't even aware it existed! Digging into it right now. — Bartvds
– Bartvds, Commented Feb 26, 2014 at 15:29

basarat · Accepted Answer · 2014-02-26 07:58:35Z

1

I used to think compiling a single file was easier, as you use <reference>s to link files and can use nested modules to manage a global namespace.

Basically using --out:

Pro: Simple to begin with. Types are importable via simple <reference comments.

Con: Single file. Not easy to debug if you debug JS.

But can you namespace types adequately using imports?

You should not use internal modules when you are using external modules. For external modules (amd/commonjs) each file is its own module. That will avoid that "extra / unnecessary" level of indirection.

And won't we still need to resolve the type annotations?

No. As soon as you export something at the root level ///<referenceing that file no longer does anything. The only way to import types (even interfaces) from such a file is to use import/require

Note:

To overcome to get the pros of --out i.e easy type import via ///<reference + still allow simpler debugging of JS, grunt-ts supports generating an amd-loader for you: https://github.com/grunt-ts/grunt-ts#advantage-of-using-amdloader-option

answered Feb 26, 2014 at 7:58

basarat

278k60 gold badges475 silver badges528 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Bartvds Over a year ago

For import/require I fear creating unresolvable dependency loops, but worth a try. The amdLoader sound good (I'm still hazy on the practical details), but could it also work for commonjs (node)?

basarat Over a year ago

could it also work for commonjs (node) it will need to be different implementation. And tricky since it is best to use import/require.

basarat Over a year ago

I fear creating unresolvable dependency loop : if a needs b and b needs a, and a is the first to execute, a gets b as null and needs to handle it

Bartvds Over a year ago

For values it is solvable, but with import it gets wonky if you want to declare types: if A has a method that returns a B, and B has a method that returns an A, then import ordering would be problematic.

Collectives™ on Stack Overflow

What is difference between compiling TypeScript to seperate modules or a single file?

1 Answer 1

Note:

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Note:

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related