TypeScript编译为一个单独的JS文件
我有一个关于TypeScript的testing项目，代码可以在这里find。
当我使用VS2012创build新项目时，会创build一个app.ts文件。 当我改变它的内容，如链接所示，并添加新模块称为GameModule ，我得到编译错误。 当我'，删除app.ts和创buildMain.ts ，一切编译好，但有一个问题 – 只有Main.ts被编译到Main.js ， GameModule.ts保持未编译。
我怎样才能让编译器合并一个JS中的所有代码？
你必须使用编译器的命令行参数
--out FILE连接并将输出发送到单个文件
例
tsc --out modules.js main.ts app.ts
使用GUI
如果安装了Visual Studio 2013和TypeScript扩展，请右键单击解决scheme资源pipe理器中的项目，然后select“ Properties 。 点击TypeScript Build选项卡。 select将Combine JavaScript output into file:组合到文件中，然后在选项旁边的input字段中input用于组合文件的名称。 请记住，您可以在此字段中使用variables。 例如：“$（ProjectDir）dist \ js \ myCombinedFile.js”。
手动
如果您无法在任何地方find此GUI选项，请手动修改您的项目configuration文件。 转到您的项目文件夹; 右键单击解决scheme资源Open folder in File Explorer的项目，然后单击Open folder in File Explorer 在popup的文件夹中，您将看到一些文件。 使用您select的任何文本编辑器编辑文件myProject.csproj 。 find两行，如下所示：
<PropertyGroup Condition="'$(Configuration)' == 'Debug'">
和
<PropertyGroup Condition="'$(Configuration)' == 'Release'">
在两个子节点树中，向每个父节点添加一个新的子节点：
<TypeScriptOutFile>$(ProjectDir)dist\js\myCombinedFile.js</TypeScriptOutFile>
当你回到Visual Studio时，他应该问你是否重新加载项目。 当然这是必须要做的变化才能生效！
我刚刚介绍的手动程序正是GUI程序为您所做的。 我对这个手册程序的思考来自于这个来源 。
最后
像平常一样build立你的项目。 如果它不起作用，请尝试重新加载您的项目。
你不需要任何第三方工具或库。
您可以使用Microsoft的System.Web.Optimization ：
BundleTable.Bundles.Add(new ScriptBundle("~/scripts/bundle.js").IncludeDirectory("~/scripts/", "*.js", true));
所有* .js文件（编译* .ts文件的结果）将在运行时在以下位置进行组合和访问：
http：// … / scripts / bundle.js
如果在当前目录中使用tsconfig.jsonconfiguration文件，则可以使用tsc --project ./构build连接的输出文件。
tsconfig.json文件可能如下所示：
{ "compileOnSave": true, "compilerOptions": { "module":"system", "target": "es5", "sourceMap": true, "outFile": "dist/app-build.js" }, "files":[ "./src/index.ts", "./typings/browser.d.ts" ] }
经典文件布局将是：
project/ - src/ - index.ts ... all my ts files - dist / - vendor.js # angular, jquery... - app-build.js # our build project - system.js # Module loader we used - index.html # call all js - typings/ - browser.d.ts - main.d.ts # for node.js server side, not included - package.json - tsconfig.json
坏消息是我们需要调用SystemJS （与RequireJS一样，但是从Tsc 1.8开始，CommonJS不被接受用于连接构build）
所以让我们快速学习SystemJS：添加SystemJS，并在index.html调用一个模块：
<html lang="en" ng-app="skeleton"> <head> <script src="system.js" type="text/javascript"></script> <script src="angular.min.js"></script> <script src="app-build.js" type="text/javascript"></script> </head> <body> <skeletonDirective></skeletonDirective> <script type="text/javascript"> System.import('index') </script></body></html>
一个很大的好处是你也可以让你的ide为你捆绑。 无论如何IDE需要编译来理解types，所以我们可以避免编译两次。 你现在不需要大量的，浏览或者任何东西。 SystemJS可能会做大部分的东西，比如加载一个html模板。
添加一个执行Browserify.js的后构build
如果我find了你的话，还有另外一种方法可以生成一个JS文件：
-
创build一个新的HTML文件，并包含所有.ts文件使用：
<script type="text/typescript" src="GameModule.ts"></script><script type="text/typescript" src="app.ts"></script> -
添加TypeScript编译 .js文件：
<script type="text/javascript" src="http://niutech.github.com/typescript-compile/js/typescript.min.js"></script><script type="text/javascript" src="http://niutech.github.com/typescript-compile/js/typescript.compile.min.js"></script> -
在浏览器中打开这个HTML文件。 自动编译的JS代码将被注入到
<script type="text/javascript"></script>结尾的一个<script type="text/javascript"></script>标记中。 您可以使用Web Inspector或Firebug进行预览和复制。
这是一个工作演示 。
