4

Is there any way how to compile TypeScript source files into single JavaScript bundle file?

We've build tool on node.js and TypeScript compilation is performed by

var ts = require('typescript');
...
var program = ts.createProgram(this.getAllInputFileNames(), this.typeScriptOptions, host);
var output = program.emit();

Currently, the typeScriptOptions is:

{ target: 1, module: 2 }

I was trying to add out into the typeScriptOptions so it was 

{ target: 1, module: 2, out: 'bundle.js' }

But no luck, the compiler still generates a lot of .js files ...

What option is needed to force TypeScript compiler to compile all input .ts files into single file?

EDIT:

With the above options the compiler generates a lot of .js files as described above. Also bundle.js is created but it is empty file.

zbynour
  • 19,747
  • 3
  • 30
  • 44
  • Don't you have on .ts file that essentially has reference to the other files? If so, you can build just that .ts file and forget about the other ones. – Patrick Jul 27 '15 at 14:31
  • It doesn't help, it still generates single .js files. The point is whether the `out` option is correct... – zbynour Jul 27 '15 at 15:11

1 Answers1

3

tsc is a compiler/transpiler of TypeScript code into JavaScript and that's it. Sure it has some options in terms of the output of what it produces but essentially its job is to create output JavaScript.

What you do with it from there is up to you.

My suggestion to bundle things up is to use browserify to bundle your code.

In short, run it pointing at your outputted JavaScript main file and supply an output bundle file and it will create a single bundle file with all the JavaScript in the appropriate order based upon dependencies.

Brocco
  • 62,737
  • 12
  • 70
  • 76
  • 1
    TypeScript does have a compiler option (`out`) to bundle all output into one file. It just seems it does not work for the op when invoked via API. – billc.cn Jul 27 '15 at 17:20
  • Understood, I was presenting a different option to get to the desired results as there are many who do not care for using `--out` ref: https://github.com/TypeStrong/atom-typescript/blob/master/docs/out.md – Brocco Jul 27 '15 at 17:33
  • Thanks for browserify as another option to solve this issue. I'm still looking for solution with `tsc` compiler because it's the feature of it and perhaps the simplest solution... – zbynour Jul 28 '15 at 07:02
  • 1
    O.K. there are guys who say `--out` is bad. But surely we need a bundle in the production. The link you provided above recommends that bundle should be created by some build tool (as you say too). But why to have another tool to create bundle.js when we have `tsc` compiler and bundling definitely has something to do with compilation? Moreover, `tsc` still has the option `--out`, but not working. It's nothing else than regression bug in TSC 1.5. – zbynour Jul 29 '15 at 05:56
  • 1
    The argument against doing that is compartmentalization. Do one thing and do it well, so `tsc` compiles and lets other tools put Humpty Dumpty together into a bundle. – Brocco Jul 29 '15 at 13:58
  • I've missed your comment, excuse me please. I've finally solved it by external bundler (I've used WebPack which works for AMD as well as CommonJs modules; Browserify didn't work for me well). The MS doesn't consider the above issue as bug but they're discussing whether next version will support it or not... Accepting and upvoting your answer, thank you... – zbynour Aug 12 '15 at 12:46
  • This answer might explain why **bundling** works, **modules** work, but **bundling plus modules** doesn't work: [35963346 / only-amd-and-system-modules-are-supported-alongside-out](https://stackoverflow.com/a/76813267/7556457) – kca Aug 01 '23 at 15:53