Typescript compile to single file

[gotenxds]

I'm using TS 1.7 and I'm trying to compile my project to one big file that I will be able to include in my html file.

My project structure looks like this:

-build // Build directory
-src // source root
--main.ts // my "Main" file that uses the imports my outer files
--subDirectories with more ts files.
-package.json
-tsconfig.json

my tsconfig file is:

 {
  "compilerOptions": {
    "module":"amd",
    "target": "ES5",
    "removeComments": true,
    "preserveConstEnums": true,
    "outDir": "./build",
    "outFile":"./build/build.js",
    "sourceRoot": "./src/",
    "rootDir": "./src/",
    "sourceMap": true
  }
}

When I build my project I expect the build.js file to be one big file compiled from my source. But ths build.js file is empty and I get all of my files compiled o js files.

Each of my TS files look a bit like this

import {blabla} from "../../bla/blas";

export default class bar implements someThing {
    private variable : string;
}

What am I doing wrong ?

[DanielRosenwasser]

Unfortunately, --module and --outFile is a trap combination for many users that is generally not useful. If you'd like to bundle your application, I'd suggest you remove outFile and use a tool like Browserify or Webpack.

[vladima]

actually in #5090 we've added support for bunding amd\system modules into one file. Can you give a try to typescript@next on npm?

[DanielRosenwasser]

Thanks for the correction @vladima, I didn't realize.

[AlexGalays]

Please consider adding native bundling support to typescript.

The workaround is a huge pain to setup and maintain: Compile all typescript modules to ES6, then transpile to ES5 with Babel using the correct babelrc, presets, etc; then feed the ES5 output to webpack (webpack 1.x doesn't support ES6)

[mhegazy]

Compile all typescript modules to ES6, then transpile to ES5 with Babel using the correct babelrc, presets, etc; then feed the ES5 output to webpack (webpack 1.x doesn't support ES6)

@AlexGalays can you elaborate on why you need the babel step there? i understand the webpack step.

[AlexGalays]

@mhegazy Good question... I had a few modules that required commonJS interop and that used to work with babel 5; now I moved to babel 6 and updated these modules anyway, so I'm going to fork my setup, remove the babel step and keep you updated.

Edit: It indeed works just fine without babel... and it's 3 times faster now, a welcomed change. Cheers.

[DmitryEfimenko]

I'm a bit confused. Should not compiling multiple files in amd mode with out setting specified result in a file with a single define(...) statement?

I'm using gulp-typescript and have approximately following:

gulp.task('compile', function() {
    var tsProject = $.typescript.createProject('tsconfig.json', {
        removeComments: true,
        module: 'amd',
        out: compiled.js`
    });

    var tsResult = gulp.src(['src/client/feature1/**/*.ts', 'src/types/**/*.ts'])
        .pipe($.typescript(tsProject));

    return tsResult.js
        .pipe(gulp.dest('build/client/feature1.js'));
});

Given that folder feature1 had two files (a.ts, and b.ts), the result is:

define("client/feature1/a", ["require", "exports"], function (require, exports) {
    "use strict";
    // feature one/a code...
});
define("client/feature1/b", ["require", "exports"], function (require, exports) {
    "use strict";
    // feature one/b code...
});

... which to my understanding is not valid anyway. Shouldn't output be something like this:

define(["require", "exports"], function (require, exports) {
    "use strict";
    // feature one/a code...
    // feature one/b code...
});

[mhegazy]

... which to my understanding is not valid anyway. Shouldn't output be something like this:

why is not it valid?

[DmitryEfimenko]

docs for requirejs state:

There should only be one module definition per file on disk.

[mhegazy]

Please see http://requirejs.org/docs/api.html#modulename

[DmitryEfimenko]

thanks for the right pointer.

[quantuminformation]

After searching for days on how to do this, and being directed here, I also support this motion. A single export file would be great, I don't mind managing my other build steps with bash.

[rochapablo]

+1

[cwbeck]

I can't be the only thinking wtf, but then again this is Microsoft, so not all that shocked

[quantuminformation]

At the moment I have a happy truce by using webpack + https://github.com/s-panferov/awesome-typescript-loader

[quantuminformation]

That loader uses tsc bare metal commands.