typescript引入js文件

在TypeScript中顺利引用jQuery的最佳操作

在使用TypeScript开发项目时，引用jQuery的技巧并不复杂，但小细节却可能导致难题。这篇文章小编将分享一些关键步骤与经验，帮助你有效避免常见错误。

引入jQuery库

最简单的技巧是在HTML文件中使用

一旦引入成功，jQuery就准备在你的页面中使用了。接下来，在TypeScript文件中，你需要声明jQuery的类型，以便编译器能够识别：

declare var $: JQueryStatic; 或者 declare var jQuery: JQueryStatic;

在这里，JQueryStatic代表jQuery的类型声明。在开始使用前，确保你已经安装了相关的类型声明文件：

npm install –save-dev @types/jquery

或者使用yarn安装：

yarn add –dev @types/jquery

确保安装完成后，TypeScript编译器就能够领会$或jQuery的含义，从而避免类型错误。

注意类型声明文件的安装

我曾经遇到过一种情况，就是遗忘安装类型声明文件，导致编译器报错，提示$未定义。当时我花费了很多时刻检查代码的其他部分，甚至怀疑jQuery引入路径是否正确，最终才觉悟到是这个小失误造成的。

模块化导入的注意事项

如果你使用模块化的方式来编写TypeScript代码，如ES Modules或CommonJS，直接在TypeScript文件中导入jQuery可能会出现难题。在这种情况下，你需要添加如下导入语句：

import * as $ from ‘jquery’;

请确保你已经通过npm或yarn成功安装了jQuery。关键点在于，这种方式与通过