我在努力
$(function(){
alert('Hello');
});
在Visual Studio中显示此错误:(TS)无法找到名称“$”..我如何使用jQuery与TypeScript ?
我在努力
$(function(){
alert('Hello');
});
在Visual Studio中显示此错误:(TS)无法找到名称“$”..我如何使用jQuery与TypeScript ?
当前回答
对于Visual Studio代码
对我来说有用的是确保我通过index.html中的< script >标记来加载标准的JQuery库。
Run
npm install --save @types/jquery
现在JQuery $函数在所有.ts文件中都可用,不需要任何其他导入。
其他回答
下面是我的TypeScript和jQuery配置步骤。
它使jQuery的类型支持比互联网上的大多数文章更好地工作。(我相信。)
第一:
npm install jquery --save
npm install @types/jquery --save-dev
第二(非常非常非常重要!!!):
import jquery = require("jquery");
// this helps TypeScript to understand jQuery best !!! otherwise It will confused .
const $: JQueryStatic = jquery;
那么,你可以享受它:
$(document).ready(function () {
$('btn').click(function () {
alert('I am clicked !')
}
}
它像丝一样光滑!!
我相信你可能需要JQuery的Typescript类型。既然你说你使用Visual Studio,你可以使用Nuget来获取它们。
https://www.nuget.org/packages/jquery.TypeScript.DefinitelyTyped/
Nuget Package Manager Console中的命令为
Install-Package jquery.TypeScript.DefinitelyTyped
更新:正如评论中提到的,这个包自2016年以来就没有更新过。但你仍然可以访问他们的Github页面https://github.com/DefinitelyTyped/DefinitelyTyped并下载这些类型。导航到库的文件夹,然后在那里下载index.d.ts文件。弹出它在你的项目目录的任何地方,VS应该立即使用它。
2019年更新:
大卫的回答更准确。
Typescript支持第三方供应商库,这些库不使用Typescript进行库开发,使用DefinitelyTyped Repo。
你需要在你的组件中声明jquery/$,如果这些类型的类型检查tsLint是On的。
如。
declare var jquery: any;
declare var $: any;
我的VS 2019程序在ASP。Net核心项目。因此,我不需要在npm命令行工具上瞎折腾,而是使用npm配置文件采取声明性的方法。
Do you have a package.json (npm dependencies config) in the root of your project? If no, right click project -> Add -> New item -> (Search npm) Select npm Configuration File and keep default filename package.json Add an entry under devDependencies. This tells npm to install "@types/jquery" which is a npm package maintained by DefinitelyTyped. This is essentially the same as the npm install command shown in other answers. "devDependencies": { "@types/jquery": "3.5.1" } Supposedly upon saving the file this should trigger the npm package install. I find I have to right click the package.json file and click Restore Packages (option not shown while project is in debug mode). The first time you run npm restore, you should switch to the Output tab/window and change dropdown to "npm" to verify there were no errors.
您应该会在Project -> node_modules/@types/jquery/下看到一个新项目 Index.d.ts是主要的typescript定义文件,它引用了其他的typescript定义文件。
打开您自己的typescript文件,并将index.d.ts从解决方案资源管理器拖到所打开的typescript文件的第一行上。这应该添加在顶部(相对路径将根据你的typescript文件的位置而变化): /// <引用路径="../node_modules/@types/jquery/index.d. "ts " / > 现在,如果你开始在typescript文件的函数中编写代码,你应该能够输入jQue并得到智能感知完成提示。
注意:最近的VS在重新启动之前没有正确地反映各种更改,特别是涉及到键入错误和智能感知的事情。你可以经常看到,甚至在官方的微软文档中,他们提到需要重新启动来解决红色曲线。因此,当有疑问时,关闭/重新打开VS.最后一步是你最可能发现智能感知在重新启动之前无法工作的地方。
不管你是否使用非npm方法包含jQuery,这个方法都有效。例如,在一个项目中,我们不使用导入、npm、js模块,也不使用requireJS来解析依赖项。jQuery只是html页面上的一个脚本标签链接。但是,我仍然可以引用。d。jQuery typedefs,以获得typescript完成/类型解析。
我可以很容易地在包中添加依赖项。jquery:“3.5.1”来获取jquery本身。
还要注意,如果VS工作正常,它在package.json中有一些缓慢的(由于web查询)名称和版本完成提示:
对于Visual Studio代码
对我来说有用的是确保我通过index.html中的< script >标记来加载标准的JQuery库。
Run
npm install --save @types/jquery
现在JQuery $函数在所有.ts文件中都可用,不需要任何其他导入。