在使用Typescript和jQuery时出现Microsoft JScript运行时错误：“$未定义”。

Question

我在尝试使用TypeScript编写一个简单的jQuery示例时，遇到了以下错误：

"tsc.js(23915, 17) Microsoft JScript runtime error: '$' is undefined"

我的整个.ts文件如下：

/// <reference path="scripts/jquery-1.8.d.ts" />

$(document).ready(function () {});

jquery-1.8.d.ts 是从 DefinitelyTyped 中获取的，但如果我使用标准的 jquery.d.ts，我会遇到相同的错误。引用标签没有出现任何错误，它是正确的，并且找到了 .d.ts 文件。

很明显，我在这里缺少一些基本知识，我无法弄清楚为什么会出现这个错误。我已经安装了 VS 2012 扩展程序，并在 jQuery 上获得了完整的自动完成...因此，当我键入“$”时，我确实会看到自动完成弹窗。生成的 .js 文件是正确的，没有问题。一个更复杂的 .ts 文件正在正常编译，并且输出的 .js 文件完全正常，因此我认为这只是一个烦恼而不是错误。或者由于这个运行时错误，我错过了其他错误吗？

我通过在 VS 中添加一个“外部工具”来编译： 命令：C:\Program Files (x86)\Microsoft SDKs\TypeScript\0.8.1.1\tsc.exe 参数：-e "$(ItemPath)" --sourcemap

- Eric Sassaman

---

哦，我刚刚发现如果我在我的.ts文件中将jQuery调用包装在一个函数中，我就不会遇到这个错误。例如，函数t(){$("#somediv").click()}不会导致错误。 - Eric Sassaman

Answer 1

我认为问题可能出现在你使用的命令本身，或者是你传递的其中一个选项。"-e"告诉编译器在编译后“执行脚本”。因此，你看到的“Microsoft JScript runtime error: '$' is undefined”不是编译错误，而是运行时错误，在文件编译完成并正在执行过程中显示出来。

希望这可以帮助你！

- Alex Klock

---

啊哈！没错，就是这个。非常感谢你。这只是表明你应该真正理解从别人那里复制和粘贴的内容 :) - Eric Sassaman

Answer 2

您需要在HTML文件中包含真正的jquery.js，例如：

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script>
<script type="text/javascript" src="myApp.js"></script>

- Ryan Cavanaugh

---

我不明白，一些 .html/.aspx 文件和我的 .ts 文件有什么关系？它们之间没有联系，除了确实有一个 .aspx 文件包含了 TypeScript 编译器生成的 .js 输出文件，但这与 TypeScript 编译器本身的错误无关，对吧？.aspx 文件确实包含 jQuery 并且可以正常工作，所以这里没有任何其他文件的问题。 - Eric Sassaman

不是楼主，但我遇到了同样的问题，这个解决方案对我有用。 - thnkwthprtls

Answer 3

不知道我们不应该重复答案...我对我的旧答案进行了一些修改。好的，我的解决方案是：

我正在使用VS 2015，并且我是TypeScript的新手。我在我的项目中使用了jQuery和leaflet。

1. 从VS 2015的NuGet管理器中下载所有这些库。

2. 按照本教程的说明拖动库文件（.js）：

https://taco.visualstudio.com/en-us/docs/get-started-first-mobile-app/

通过添加以下行修改index.html文件。

<link rel="stylesheet" href="css/jquery.mobile-1.4.5.min.css" />
<link rel="stylesheet" href="css/leaflet.css" />

<script src="scripts/jquery-2.2.3.min.js"></script>
<script src="scripts/jquery.mobile-1.4.5.min.js"></script>
<script src="scripts/leaflet-0.7.3.min.js"></script>

修改index.ts文件。首先在顶部添加这些行以引用您的库。您可能需要更改路径。

/// <reference path="jquery.d.ts"/>
/// <reference path="leaflet.d.ts"/>

在onDeviceReady()函数内添加您自己的代码，否则可能会出现JavaScript运行时错误，例如符号"$"未定义。我猜这是因为代码尝试在设备尚未准备好时加载某些函数。这对我有用过。希望它也能帮到您。

    function onDeviceReady() {

    document.addEventListener('pause', onPause, false);
    document.addEventListener('resume', onResume, false);


    var parentElement = document.getElementById('deviceready');
    var listeningElement = parentElement.querySelector('.listening');
    var receivedElement = parentElement.querySelector('.received');
    listeningElement.setAttribute('style', 'display:none;');
    receivedElement.setAttribute('style', 'display:block;');

    // 在此处添加您的代码

    }

- Luo Lei

Answer 4

-- 删除了我的原始答案..

你在哪里遇到了这个错误："tsc.js(23915, 17) Microsoft JScript runtime error: '$' is undefined"？

此外，在这个主题中，有一个很好的概述，介绍如何让编译器在构建时编译你的 .ts 文件：http://typescript.codeplex.com/discussions/403394 之后，你可以将 .ts 文件的构建操作保持为 "TypeScriptCompile"

- BreeeZe

---

在执行工具菜单中的自定义命令后，错误会显示在VS输出窗口中，就像我提问时所述。当然，在命令行中也会出现相同的错误。 - Eric Sassaman

谢谢你的提示，但它被添加到解决方案作为一个网站，而不是一个项目，因为没有项目文件，我不能让事情变得那么简单。:\ - Eric Sassaman

嗯...好吧，我对如何解决你的原始问题没有其他提示，但你也可以尝试使用Visual Studio的“Web Essentials 2012”插件：http://visualstudiogallery.msdn.microsoft.com/07d54d12-7133-4e15-becb-6f451ea3bea6 它为TypeScript添加了一些不错的功能，并在保存时编译你的.ts文件。 - BreeeZe

我正在使用 Andrey Taritsyn 开发的极好的 "Bundle Transformer: TypeScript" NuGet 包，它让生活变得更加简单（至少在使用捆绑时如此）。 - Eric Sassaman