javascript - 为什么在 visual studio 中使用 typescript 时需要在 default.htm 中包含多个 .js 文件?

标签 javascript visual-studio visual-studio-2012 typescript

我刚开始使用 typescript 。我想尝试使用 this mankala example从 Visual Studio 中。最终我让它工作了,但我必须将所有从 .ts 文件生成的 .js 文件包含在我的 default.htm 文件中。示例中的 .htm 文件仅包含一个文件 - 包含入口点的文件。我猜我的配置中设置了错误,我正在通过包含多个 .js 进行补偿。谁能告诉我我做错了什么?

更多细节如下......

这是原始 .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>

这是我修改后的 .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>

为了创建项目,我创建了一个默认(不是很空)的 typescript 项目,从该项目中删除了自动创建的 app.ts 文件,然后添加了 6 个与示例中的 .ts 文件同名的新 .ts 文件.然后我将示例中的 .ts 文件复制到 VS 创建的新 .ts 文件上。我将自动生成的 app.css 文件替换为示例中的 play.css 文件,并将自动生成的 default.htm 文件的内容替换为示例中的 play.htm 的内容。这没有运行,但在我将额外的 .js 文件添加到 default.htm 之后它运行了。

我正在使用适用于 Web 的 Visual Studio 2012 Express 和 typescript 0.8.3.1 VS 扩展。我在 windows7 上使用 Chrome 浏览器。

最佳答案

这里的区别在于编译器是如何被调用的。

当您构建 Mankala 示例时,假设您阅读了自述文件,您运行了

tsc Driver.ts -out game.js

-out flag 告诉编译器将编译连接成一个大的 .js 文件。但是,Visual Studio 项目中的默认行为是并排构建,即 base.ts创建base.js , Features.ts创建 Features.js

您可以通过添加 <TypeScriptOutFile>game.js</TypeScriptOutFile> 来修复您的项目文件元素到项目中相同 <PropertyGroup>与其他 TypeScript 设置一样(默认新项目中的第 57 行附近)。一定要同时添加 DebugRelease PropertyGroup元素,如果你想在两个编译设置中有相同的行为,或者创建一个新的非条件 PropertyGroup .

关于javascript - 为什么在 visual studio 中使用 typescript 时需要在 default.htm 中包含多个 .js 文件?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17093960/

相关文章:

c# - 使用 Id 而不是 Context

c# - 如何强制调试器跳过一段代码?

visual-studio - 验证 web.config 的工具

C++继承与LNK2019

javascript - Bootstrap 表条件显示/隐藏列

javascript - 如何设置弹出窗口的字体大小?

javascript - 使用javascript以 "dropdown"风格缓慢地显示隐藏的div

javascript - 属性在装饰器中未定义

asp.net-mvc - 如何将 MVC3 Web 应用程序部署到 Azure

asp.net-mvc-4 - VS2012 RTM 缺少 .net 4.5 和 mvc 项目模板