JavaScript in VS Code

众所周知 VS Code 是借助 d.ts 对 js/ts 进行 智能感知(IntelliSense) 精准提示的。
官方维护着一个庞大的 DefinitelyTyped 囊括了流行的模块的 d.ts
所以你会发现不论是 js 还是 ts 都可以为流行库进行 智能感知
如果是 ts 项目,也许大家都会操作,但 js 项目想自定义 d.ts 实现 智能感知 怎么破?

官网文档

JavaScript in VS Code
百度无果后,在官网翻到了这个,如果英文不错的,推荐直接看文档。
我就大致看了下, 简单实现了下,没有仔细深入去阅读文档。

一. 配置 jsconfig.json

实现你要在项目中配置一个 jsconfig.json,不一定放在跟目录,如果你项目源码在 src 中,那放 src 下不错。
如果你全局安装了 typescript,那么在项目跟目录执行 tsc --init 即可生成一个 tsconfig.json 然后修改为 jsconfig.json 即可。根据文档上说 jsconfig.json 是默认开启了 "allowJs": truetsconfig.json,所以直接用 tsc --init 生成一个,这样所有配置都会带有注释说明。
详细配置请看官网文档 jsconfig.json。

最后记得重启下 vscode 使其生效。

二. 添加全局 globals.d.ts

在你项目任意位置创建 globals.d.ts,然后写你的声明:

1
2
3
4
5
interface Window {
webkitNotifications: any;
}

declare var CAN_NOTIFY: number;

然后在任意地方都能智能感知 CAN_NOTIFY 变量,以及 window.webkitNotifications 属性。

三. js 文件 d.ts

例如你有个 utils/string.js 字符串处理工具文件,那么在同级目录下创建 string.d.ts 然后写你的声明即可。

四. npm 模块 d.ts

如果是 npm 模块,则需要在项目跟目录添加 index.d.ts
或者在 package.json 中添加 "typings": "types/main.d.ts" 来指定 d.ts 路径。

小结

至此,智能感知 功能配置完成,如果不会写 d.ts 的话,去看下 ts 官网文档,或者百度吧。

文章来源:

Author:楼教主
link:http://www.52cik.com/2017/11/07/javascript-in-vscode.html