如何在 VS Code 中使用 Typescript 定义为我自己的 Javascript 服务获取 Intellisense?

Posted

技术标签:

【中文标题】如何在 VS Code 中使用 Typescript 定义为我自己的 Javascript 服务获取 Intellisense?【英文标题】:How to use Typescript definitions to get Intellisense for my own Javascript services in VS Code? 【发布时间】:2016-11-17 03:43:28 【问题描述】:

我正在使用 SailsJS 开发后端服务器。它基本上将所有模型助手服务以及我自己的服务注入到全局命名空间中。如果我能够为这些服务获得 Intellisense,我会受益匪浅。

我首先设置了 typings 并为 lodash 和 node 安装了全局类型定义。创建 jsconfig.jsontsconfig.json 文件后,它就像一个魅力。

接下来我想为我自己的服务创建一个基本定义文件。我在 typings/globals 中创建了一个目录,其中包含一个 index.d.ts 文件:

declare namespace foo 
    export function bar();

declare var baz:  some: number ;

这只是为了确保如果定义不起作用,我不会浪费时间编写定义。

接下来,我通过添加引用标记将 index.d.ts 文件包含在 typings/index.d.ts 中:

/// <reference path="globals/psiewakacje/index.d.ts" />

令我惊讶的是,它在我项目的 javascript 文件中不起作用。在输入 foo.baz. 时,我没有得到任何明智的 Intellisense。

 

我能够获得的唯一 Intellisense 支持是当我通过以下方式在每个文件中导入这些服务时:

import * as InternalParser from '../services/InternalParser';

var InternalParser = require('../services/InternalParser');

但这不使用 Typescript 的定义文件,只是给了我导出的属性。总体而言,结果并不理想。

 

我想知道如何让它正常工作。我查看了 node 和 lodash 的类型定义文件,它们也是这样做的:声明一个具有特定类型的变量/命名空间。但是,他们的定义在 Javascript 中有效,而我的则不行。如何正确处理?

【问题讨论】:

github.com/bryanmacfarlane/sanenode 您是否尝试将您的.d.ts 包含在您的 package.json 中? 如果有一天有人偶然发现了这个问题,那么完美的答案就在这里:***.com/questions/46678663/… 【参考方案1】:

您无需添加对typings/index.d.ts 的引用。最简单的方法是将您的声明添加到项目中任何位置的全局声明文件中。

此外,不要使用varnamespace,而是使用interface

例如。在您的目录的根目录中,您可以轻松添加

// index.d.ts
interface Foo 
  bar: () => void


interface Baz  some: number 

【讨论】:

这不起作用。在 typings/index.d.ts 文件中准确输入此代码后,当我输入 Fo 后跟 Ctrl + Space 时,我仍然没有自动完成。此外,我希望这些类型不是全局的,而是依赖于导入的文件。例如,我想要一个typings/Foo.d.ts,当我在某处包含src/models/Foo.js 时使用它。这甚至可能吗?【参考方案2】:

我遇到了同样的问题,发现编辑器(VSCode)在错误的目录中查找文件,通过相对引用正确的路径解决了问题,具体路径会有所不同,但在我的示例中是:

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

index.d.ts 包含以下内容:

/// <reference path="globals/core-js/index.d.ts" />
/// <reference path="globals/jasmine/index.d.ts" />
/// <reference path="globals/node/index.d.ts" />

我的目录/文件结构如下:

【讨论】:

对我来说,问题是没有获得自定义模块的 Intellisense,而不是安装了类型的模块,所以不幸的是,这不是我的解决方案。不过,感谢您的尝试! 啊明白了!如果我遇到其他可能有帮助的事情,我会告诉你的。【参考方案3】:

如果我创建一个没有"allowJs": "true" 编译器选项的tsconfig.json 文件,我可以重现所描述的行为。如果您希望将您的 TypeScript 和 JavaScript 文件视为一个项目,您应该有一个 tsconfig.json 文件,其中包含 "allowJs": "true" 并且没有 jsconfig.json 文件。

【讨论】:

所以,如果我将我的 jsconfig.json 文件更改为带有 tsconfig.json"allowJs": true 文件,我将能够在 JS 中编写代码为我的.js 文件?您可以查看this comment,以详细了解我想要实现的目标。 是的。对于依赖于导入文件的类型,您的 .d.ts 文件需要与您的 .js 文件并排,或者基于 rootDirs 编译器选项几乎与它并排。如果您需要更多帮助来满足原始问题中未描述的要求,请提交一个新问题。 它对我不起作用。我尝试重新创建原始问题并应用您的建议,但我不再获得任何智能感知。 在github.com/mattmccutchen/***-38370549 上查看我的工作示例项目。 我找到了绝对完美的答案here。而且它不需要我使用 tsconfig 文件而不是 jsconfig。

以上是关于如何在 VS Code 中使用 Typescript 定义为我自己的 Javascript 服务获取 Intellisense?的主要内容,如果未能解决你的问题,请参考以下文章

如何在 VS Code 中使用 Libman json 文件?

如何使用 VS Code 在 .vue 文件中使用 Typescript?

在 VS Code 中使用 Git Bash 终端 - 如何强制它在内部打开

如何使用 TypeScript 在 VS Code 中找到模块“fs”?

如何使用 VS Code 在 Docker 容器中远程调试 python 代码

如何在 VS Code 中调试夜班测试