Javascript 如何将JQuery导入到Typescript文件中？ 更新

不需要导入。相反，我需要在文件顶部添加一个引用。因此，我的WebAPI.js的第一行应该是

//

，而不是从“../jquery-3.1.1”导入{$}

---

我正在尝试导入jQuery以在Typescript文件中使用，但我尝试的每件事都会收到各种错误。我遵循解决方案，但没有任何运气

tsconfig.json WebAPI.js

从“../jquery-3.1.1”导入{$}；
导出类ExpenseTransaction扩展了APIBase{
构造函数（）{
超级（）；
}
Get（）：void{
让费用：数组；
让自我=这个；
$.ajax({
url:this.Connection，
键入：“获取”，
contentType:“应用程序/json”，
数据类型：“json”，
成功：函数（数据：任意）：无效{
费用=自转换实体（数据值）；
},
错误：函数（数据：any）：void{console.log（data.status）；}
});
};
}

我还尝试了从“../jquery.3.1.1”以$形式导入*

错误

• 模块jquery-3.1.1没有导出的成员$

• 属性ajax在类型上不存在（选择器：any，上下文：any）=>any

---

您必须从“jquery”将其导入为

import*as$，根据typescript，模块定义为环境模块：

declare module "jquery" {
    export = $;
}

根据：

环境声明是您对编译器做出的承诺。
如果这些在运行时不存在，并且您尝试使用它们，那么事情将在没有警告的情况下中断

不需要导入。而是在文件顶部添加对Typescript定义文件的引用。因此，
WebAPI.js
的第一行应该是

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

根据维基：

TypeScript声明文件是定义类型、函数的方法
以及外部第三方JavaScript库中的参数。利用
TypeScript代码中的声明文件将启用Intellisense
并根据正在使用的外部库进行类型检查

jquery.d.ts
是GitHub上的一部分。可以通过NuGet软件包管理器在Visual Studio项目中包含明确键入的内容。
在使用npm安装jquery或与cdn一起使用后执行此操作：

第一名：

npm install @types/jquery --save-dev

和之后：

从“jquery”导入*为$

尝试将导入替换为
宣布出租美元：任何
 Tim使用reference编译器指令的解决方案有效，但是现在有一种更简单的方法

在tsconfig.json中，如果设置typeRoots，则根本不需要在.ts文件中执行任何操作。TypeScript为您完成这项工作

它是如何工作的？

在我的解决方案中，我通过npm拉入所有@types，因此它们被放置在./node_modules/@types。我还有一些我在./@types手工创建的类型

在我的tsconfig.json中，我添加了：

 "compilerOptions": {     
   // lots of other config here
   "typeRoots": [
     "./node_modules/@types",
     "./@types"
   ]
  }

现在，编译器会自动发现并使用我的所有类型，因此无需麻烦使用引用标记

总之…

我应该注意到，如果您这样做并尝试显式导入jquery，它将失败，您将感到困惑。我当然是这样。
在visual studio社区中，为了完成这项工作，我必须在head/script部分添加html中的jquery，然后在jquery脚本部分下面添加我的app.ts，然后在我的typescript源代码中添加对jquery库的引用

在html页面的标题部分：

<script src="./Scripts/jquery-3.5.1.js"></script>
<script src="app.js"></script>



在app.ts中，ts脚本的第一行：

/// <reference path ="./Scripts/typings/jquery/jquery.d.ts"/>

//
您安装打字了吗
npm安装——保存dev@types/jquery
@Rens我从NuGet获得了
typings/jquery/jquery.d.ts
文件。这是同一件事吗？你安装了这个软件包吗@Rens是的，我只需要从“jQuery”导入作为jQuery的
import*
然后在任何地方使用
jQuery
而不是
$
。这样做的问题是，您将丢失对jQuery命名空间的所有Intellisense和类型检查。My TSConfig没有定义类型根。它仍然引用@types。正因为如此，我才有了问题。它不会在编译时编译，但在运行时会产生错误。所以，即使我不包括导入，它也不是在抱怨。也许可以定义它？在这里查看文档：在“@types，typeroot和types”下。它描述了默认情况下，它如何尝试查找所有可见的@types，而这种行为在prod中似乎不适用。
 "compilerOptions": {     
   // lots of other config here
   "typeRoots": [
     "./node_modules/@types",
     "./@types"
   ]
  }

<script src="./Scripts/jquery-3.5.1.js"></script>
<script src="app.js"></script>

/// <reference path ="./Scripts/typings/jquery/jquery.d.ts"/>