Stop grunt-ts from compiling references

Question

I've recently switched from using Web Essentials to grunt-ts to compile my typescript files due to the flexibility of output. Part of the reason I switched is that I don't want all files compiled seperately, and I don't want to have all files compiled to a single file. I want a bit of both. Since I've recently started using grunt for a lot of tasks, I thought I might as well switch my TS build too.

Here's my gruntfile

module.exports = function (grunt) {
    grunt.initConfig({
        pkg: grunt.file.readJSON('package.json'),
        dirs: {
            distribution: 'script/dist',
            ts_root: 'script/src',
            ts_controllers: 'script/src/controllers'
        },
        ts: {
            apprunner: {
                src: ['<%= dirs.ts_root %>/main.ts'],
                out: '<%= dirs.distribution %>/src/main.js',
                options: {
                    target: 'es5'
                }
            },
            controllers: {
                src: ['<%= dirs.ts_controllers %>/*.ts'],
                out: '<%= dirs.distribution %>/src/controllers.js'
                options: {
                    target: 'es5'
                }
            }
        }
    });

    grunt.loadNpmTasks('grunt-ts');

    grunt.registerTask('default', ['ts']);
};

Inside the main.ts file, I have to reference one of the typescript files that, when compiled, makes up part of the controllers.js file.

So my main.js file I have the following:

/// <reference path="controllers/ExampleController.ts" />

var newExample = new wctApp.controllers.ExampleController();

Grunt compiles my controllers.js file fine:

var wctApp;
(function (wctApp) {
    (function (controllers) {
        var ExampleController = (function () {
            function ExampleController() {
            }
            return ExampleController;
        })();
        controllers.ExampleController = ExampleController;
    })(wctApp.controllers || (wctApp.controllers = {}));
    var controllers = wctApp.controllers;
})(wctApp || (wctApp = {}));

But it compiles the same code inside the main.js file.

var wctApp;
(function (wctApp) {
    (function (controllers) {
        var ExampleController = (function () {
            function ExampleController() {
            }
            return ExampleController;
         })();
        controllers.ExampleController = ExampleController;
    })(wctApp.controllers || (wctApp.controllers = {}));
    var controllers = wctApp.controllers;
})(wctApp || (wctApp = {}));
;
var newExample = new wctApp.controllers.ExampleController();

If I remove the reference from the main file, it won't build because it can't find ExampleController. How can I keep the reference to this file, but stop it from being compiled in the main.js file.

Answer 1

Don't use out. Because out merges all the TypeScript files into one. Instead use outDir (if you need to redirect to a different folder). Or better don't use anything (no out no outDir) and it will put the generated JS next to the file.