在我自己的JS ES6模块库中以VS Code实现Intellisense

时间:2018-12-03 12:12:50

标签: javascript typescript visual-studio-code es6-modules

VS Code Intellisense确实对于处理内部项目文件,为我们提供自动完成功能甚至利用书面JSDoc十分有用。

但是,我正在研究不同的JS项目,这些项目依赖于定制的JS库(带有Bitbucket Cloud存储库的ES6模块,可通过NPM或Yarn检索)。

自然,我也想从Intellisense中受益那些库,因为我知道JSDoc是可用的。但是可悲的是,我似乎找不到办法。

我试图显式地将库中的文件包含在jsconfig.json中,但无济于事:

{
  "compilerOptions": {
    "target": "es2017",
    "moduleResolution": "node",
    "checkJs": true,
    "allowSyntheticDefaultImports": true,
    "noEmit": true,
    "noImplicitAny": false,
    "strictNullChecks": false,
    "alwaysStrict": true,
    "sourceMap": false
  },
  "include": ["src/**/*", "node_modules/my-lib/**/*"]
}

有没有一种简单的方法可以告诉VS Code考虑我的库文件? 据我了解,实现此目标的一种方法是为每个库编写和发布打字稿定义文件。但是,我感觉好像缺少了一些东西,并且VS Code当然必须能够处理我的库JS文件,就像它处理内部项目文件一样。

1 个答案:

答案 0 :(得分:0)

这个问题现在已经很老了,但是我最近也遇到了同样的问题。以下是我想出了。

正如您提到的,一种方法是创建类型声明文件。幸运的是,您可以使用tsd-jsdoc软件包通过jsdoc注释来完成此操作。

我将以下脚本添加到package.json以构建类型文件...

jsdoc -r src -t node_modules/tsd-jsdoc/dist -d lib

这将创建一个lib/types.d.ts文件。

在您的package.json中添加一个types条目,指向该文件。

确保此文件作为prepublishOnly脚本的一部分运行,以便在运行npm publish时文件是最新的。

通常,我的src / index.js文件仅包含几行export { default as thing } from './thing';。为了获得vscode可以读取的正确声明文件,我必须像这样格式化文件...

/** @module my-module */

export { default as thing1 } from './thing1';
export { default as thing2 } from './thing2';

然后在导出的thing1和thing2 jsdoc注释中添加@memberof module:my-module,例如...

/**
 * Thing 1
 * @param {string} thing
 * @memberof module:my-module
*/
function thing1(thing) {
}

export default thing1;