visual studio - Compilando proyecto TypeScript dentro de proyecto ASP.NET5

Instalé la última beta8 de ASP.NET5 y creé un nuevo proyecto. Dentro del proyecto creé una nueva carpeta, agregué el archivo tsproject.json y escribí algunos archivos TypeScript .ts

Quiero compilar automáticamente mi subproyecto de TypeScript. ¿Qué debo hacer? ¿Debería escribir algún tipo de tarea de grunt, habilitar la compilación automática de archivos TypeScript en VS (pero ¿compilará todos los archivos en la carpeta usando la configuración de tsconfig.json?), o algo más?

Respuesta #1

Agrega un archivo tsconfig.json en la raíz de tu proyecto:

{
  // TypeScript to JavaScript compilation options. Add what you want here.
  "compilerOptions": {
    "noImplicitAny": true,   // Do not allow implicit any variables.
    "noEmitOnError": true,   // Stop processing on error.
    "removeComments": false, // Do not remove comments.
    "sourceMap": false,      // Do not create source map files.
    "module": "commonjs",    // Use the Common JS modules or some other format.
    "target": "es5"          // Compile to ECMAScript 5.
  },
  // Exclude the bower_components, node_modules and wwwroot folders from
  // being scanned for TypeScript (.ts) or TypeScript definition (.d.ts) files.
  "exclude": [
    "bower_components",
    "node_modules",
    "wwwroot"
  ]
}

Agrega el gulp-typescript para compilar archivos .ts, gulp-concat para concatenar archivos y merge-stream para fusionar flujos de Gulp a package.json:

{
    // Omitted...
    "devDependencies": {
        // Omitted...
        "gulp-concat": "2.6.0",
        "gulp-typescript": "2.9.2",
        "merge-stream": "1.0.0"
    }
}

En tu archivo gulpfile.js, agrega una nueva tarea de compilación de TypeScript (muestro cómo hacer compilaciones incrementales para tiempos de compilación más rápidos, así que esto es un poco avanzado, puedes consultar la documentación de gulp-typescript si quieres ver algo más sencillo):

var gulp = require("gulp");
var concat = require("gulp-concat");
var typescript = require("gulp-typescript");
var merge = require("merge-stream");

// A TypeScript project is used to enable faster incremental compilation, 
// rather than recompiling everything from scratch each time. Each 
// resulting compiled file has it's own project which is stored in 
// the typeScriptProjects array.
var typeScriptProjects = [];
function getTypeScriptProject(name) {
    var item;
    for (var i = 0; i < typeScriptProjects.length; ++i) {
        if (typeScriptProjects[i].name === name) {
            item = typeScriptProjects[i];
        }
    }

    if (item === undefined) {
        // Use the tsconfig.json file to specify how TypeScript (.ts) 
        // files should be compiled to JavaScript (.js).
        var project = typescript.createProject("tsconfig.json");
        item = { name: name, project: project };
        typeScriptProjects.push(item);
    }

    return item.project;
}

var sources = {
    // An array containing objects required to build a single JavaScript file.
    ts: [
        {
            // name - The name of the final JavaScript file to build.
            name: "main.js",
            // paths - A single or array of paths to TypeScript files.
            paths: [
                "Folder1/one.ts",
                "Folder1/two.ts",
                "Folder2/**/*.ts"
            ]
        }
    ]
};

gulp.task("build-ts", function () {
    var tasks = sources.ts.map(function (source) { // For each set of source files in the sources.
        return gulp                                // Return the stream.
            .src(source.paths)                     // Start with the source paths.
            .pipe(typescript(getTypeScriptProject(source))) // Compile TypeScript (.ts) to JavaScript (.js) using the specified options.
            .pipe(concat(source.name))             // Concatenate JavaScript files into a single file with the specified name.
            .pipe(gulp.dest("./wwwroot/js/"));     // Saves the JavaScript file to the specified destination path.
    });
    return merge(tasks);                           // Combine multiple streams to one and return it so the task can be chained.
});

Respuesta #2

Por cierto, ¿puedo usar varios tsconfig.json y ponerlos dentro de subcarpetas?

tsc -p ./subfolder