tsc --out weird behavior when using 'import' in my files

I have two typescript files, app.ts, and `angular2.d.ts' (which contains type definitions for angular2)

my tsconfig.json file looks like so:

{
"compilerOptions": {
    "module": "commonjs",
    "out": "public/all.js",
    "sourceMap": true,
    "watch": true,
    "target": "ES5"
},
"files": [
    "typings/angular2/angular2.d.ts",
    "src/app.ts"   
]}

Expected result - public/all.js would contain the compiled ts file.

Actual result - src/app.js file is created, that contains the compiled ts file. public/all.js is also created, but it only contains the following line: //# sourceMappingURL=all.js.map (i.e. just the source mapping, no actual code)

When investigating further, the problematic line is: import {Component, View, bootstrap} from 'angular2/angular2'; in src/app.ts. as soon as I remove that line everything compiles correctly. as soon as i put it back - it causes the aforementioned problem.

What am I doing wrong?

Solution

Settings "out":"public/all.js" and "module":"commonjs" are mutually exclusive. You should either:

Use internal modules and let the compiler concatenate output file for you (remove module setting from config);
@basarat would advise you against it, but I think it's not that bad, especially for small projects.
Use external modules and concatenate output files with other tools (set "outDir":"public/" and remove out setting from config).

commonjs modules are meant for Node.js, amd modules are meant for require.js. If you're doing frontend development, it's best to use amd or internal modules.