在Visual Studio中使用打字稿时，为什么需要在default.htm中包含多个.js文件？
[英]Why do I need to include multiple .js files in default.htm when working with typescript in visual studio?
问题描述
I'm just starting out with typescript. 
我只是从打字稿开始。 I wanted to try working with this mankala example from within Visual Studio. 我想尝试在Visual Studio中使用此mankala示例 。 Eventually I got it working but I had to include all of the .js files that were generated from .ts files in my default.htm file. 最终，我使它工作了，但是我必须在default.htm文件中包括从.ts文件生成的所有.js文件。 The .htm file in the example only included one file - the one that contained the entry point. 该示例中的.htm文件仅包含一个文件-包含入口点的文件。 I'm guessing that there's something set wrong in my configuration that I'm compensating for by the multiple .js includes. 我猜我的配置中有些错误，我要通过多个.js包含项来弥补。 Can anyone tell me what I'm doing wrong? 谁能告诉我我在做什么错？
More details follow... 更多详细信息如下...
Here's what the original .htm file looked like: 这是原始.htm文件的样子：
<!DOCTYPE html>
<html>
<head>
<title>Mankala</title>
<meta http-equiv="X-UA-Compatible" content="IE=9"/>
<script type="text/javascript" src="game.js"></script>
<link rel="stylesheet" type="text/css" href="play.css"/>
</head>
<body id="bod" onload="Mankala.testBrowser()">
<div class="hscore">Human: <span id="humscore">0</span></div>
<div class="cscore">Computer: <span id="compscore">0</span></div>
</body>
</html>
And this is what my modified .htm file looked like: 这就是我修改后的.htm文件的样子：
<!DOCTYPE html>
<html>
<head>
<title>Mankala</title>
<meta http-equiv="X-UA-Compatible" content="IE=9"/>
<script type="text/javascript" src="base.js"></script>
<script type="text/javascript" src="Driver.js"></script>
<script type="text/javascript" src="Features.js"></script>
<script type="text/javascript" src="Game.js"></script>
<script type="text/javascript" src="geometry.js"></script>
<script type="text/javascript" src="Position.js"></script>
<link rel="stylesheet" type="text/css" href="play.css"/>
</head>
<body id="bod" onload="Mankala.testBrowser()">
<div class="hscore">Human: <span id="humscore">0</span></div>
<div class="cscore">Computer: <span id="compscore">0</span></div>
</body>
</html>
To create the project I created a default ( not quite empty ) typescript project, deleted the automatically created app.ts file from that project and then added 6 new .ts files with the same names as the .ts files in the example. 为了创建项目，我创建了一个默认的（不是很空的）打字稿项目，从该项目中删除了自动创建的app.ts文件，然后添加了6个与示例中的.ts文件名称相同的新.ts文件。 Then I copied the .ts files from the example over the new .ts files that were created by VS. 然后，将示例中的.ts文件复制到VS创建的新.ts文件上。 I replaced the automatically generated app.css file with the play.css file from the example and replaced the contents of the automatically generated default.htm file with the contents of the play.htm from the sample. 我将示例中的play.css文件替换为自动生成的app.css文件，并将示例中的play.htm内容替换为自动生成的default.htm文件。 This didn't run but after I added the additional .js files to default.htm it did. 这没有运行，但是在我将其他.js文件添加到default.htm之后，它确实运行了。
I'm using Visual Studio 2012 Express for the Web and the typescript 0.8.3.1 VS extension. 我将Visual Studio 2012 Express用于Web和打字稿0.8.3.1 VS扩展。 I'm using the Chrome browser on windows7. 我正在Windows7上使用Chrome浏览器。
1 个解决方案
解决方案1
2 已采纳 2013-06-13 18:38:54
The difference here is how the compiler got invoked. 此处的区别在于编译器的调用方式。
When you build the Mankala sample, assuming you read the README, you ran 在构建Mankala示例时，假设您已阅读自述文件，
tsc Driver.ts -out game.js
The -out flag tells the compiler to concatenate the compilation into one big .js file. -out标志告诉编译器将编译链接到一个大的.js文件中。 However, the default behavior in Visual Studio projects is to build side-by-side, ie base.ts creates base.js , Features.ts creates Features.js , etc. 但是，Visual Studio项目的默认行为是并排构建，即base.ts创建base.js ， Features.ts创建Features.js等。
You can fix your project file by adding a <TypeScriptOutFile>game.js</TypeScriptOutFile> element to the project in the same <PropertyGroup> as the other TypeScript settings (near line 57 in a default new project). 您可以通过将<TypeScriptOutFile>game.js</TypeScriptOutFile>元素添加到与其他TypeScript设置相同的<PropertyGroup>的项目中来修复项目文件（默认情况下，在新项目的第57行附近）。 Be sure to add to both the Debug and Release PropertyGroup elements if you want the same behavior in both compilation settings, or create a new non-conditional PropertyGroup . 如果要在两个编译设置中都具有相同的行为，请确保同时添加到Debug和Release PropertyGroup元素，或者创建一个新的无条件PropertyGroup 。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.