Vscode中Javascript使用TypeScript文件实现智能提示

Vscode中Javascript使用TypeScript文件实现智能提示

其实智能提示就是引用库，从而智能提示库中的各类成员

VsCode在JavaScript项目中链接或配置TypeScript文件类型(即*.d.ts文件)，来实现智能提示，因此我们可以自己编写(根据TypeScript语言规范重新编写已有的JavaScript文件库)或者利用别人编写好的TypeScript文件。

下面例子是使用别人编写好的TypeScript文件

步骤一

下载安装Node.js，因为要使用到npm，npm是Nodejs的管理器，跟随Nodejs安装。

步骤二

同时按WIN键和R键，打开Run窗口，输入cmd，打开命令提示符窗口

步骤三

在命令提示符窗口输入命令转到你所在项目的路径

步骤四

在项目路径下的命令提示符窗口中输入

npm install --save @type/package

备注：package指你所需要的TypeScript文件所在的文件包,你在哪个路径下执行该命令下载的文件包就会出现在哪个路径下。

例子，我需要openlayers的TypeScript文件

npm install --save @type/openlayers

下载完成后，你可以看到@types文件夹，在它下面就是你要的文件夹，而最里面的*.d.ts文件就是我们所要的TypeScript文件

那么如何知道你所要的TypeScript文件别人是否编写好，并且上传到npm库中，你可以登陆网址：https://microsoft.github.io/TypeSearch/

步骤五

一、利用jsconfig.js文件引用TypeScript文件

在JavaScript项目中创建jsconfig.json文件，然后配置以下内容

{
"typeAcquisition": {
"include": [
"package"
]
}
}

备注：package同上

对于更多的jsconfig.json文件(此文件只支持JavaScript文件)配置请登录VsCode网址

二、直接引用TypeScript文件

在JavaScript文件中最顶层输入代码

/// <reference  path="TypeScript文件的路径"

例子

/// <reference  path="@types/openlayers/index.d.ts"