编译ASP.NET5项目中的TypeScript项目

Question

我安装了最新的ASP.NET5 beta8并创建了新项目。在项目内部，我创建了一个新文件夹，添加了tsproject.json文件并编写了一些TypeScript文件。我想要自动编译我的TypeScript子项目。我该怎么办？我应该写些什么样的咕噜任务，在VS中启用自动的TypeScript文件编译（但它会使用tsconfig.json设置来编译文件夹中的所有文件？）还是其他？

Answer 1

一个tsconfig.json文件添加到您的项目的根：

{ 
    // 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" 
    ] 
} 

添加gulp-typescript编译.ts文件，gulp-concat来连接文件和merge-stream合并咕嘟咕嘟流至package.json：

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

在你的gulpfile.js文件中，添加一个新的构建TypeScript任务（我展示了如何进行增量构建以缩短构建时间，所以这有点高级，你可以查看文档

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. 
}); 

Answer 2

BTW我可以用几个tsconfig.json，并把它们里面的子文件夹：如果你想要看的东西简单）吞掉，打字稿？

TSC -p ./subfolder