链接运行时依赖项，用于 VSCode 自动完成答案

【问题标题】：Link runtime dependencies, for VSCode autocomplete链接运行时依赖项，用于 VSCode 自动完成
【发布时间】：2021-11-14 14:43:36
【问题描述】：

我无法让 VSCode 将代码内函数参数链接到它们的依赖项（变量、函数、模块），并在代码中获得自动完成建议。

有没有办法通过 JSDoc 让 VScode 识别某个参数对应的模块是什么？

// const database = require('./data-access/mongodb-adapter.js')

/**
 * Factory for our service
 * 
 * QUESTION: Can JSDoc refer a module in another file?
 *          (and instruct VSCode to wire it)
 *
 * @param {module('./data-access/mongodb-adapter.js')} database   The adapter to the app database
 */
function makeService(database) {
    return {
        find: query => database.find(query)
    }
}

module.exports = makeService

在 PHP 中，使用 PHPDoc，我将 type-hint 变量 $database，在同一范围内添加注释 /* @var MongodbAdapter $database */。
VSCode 使其可点击（当按住 cmd ⌘ 时）并将我链接到引用的模块/文件/函数。

有没有办法在工厂/构造函数依赖项上指定相同的内容？ （不转译）

【问题讨论】：

标签： javascript visual-studio-code intellisense jsdoc

【解决方案1】：

在某些情况下，如果您使用的是 js 文件，则需要在项目的根目录下创建一个 jsconfig.json


{
  "compilerOptions": {
    "target": "es5",
    "lib": [
      "dom",
      "ES5",
      "dom.iterable",
      "esnext",
      "ES2015",
      "ES2016",
      "ES2017",
      "ES2018",
      "ES2019",
      "ES2020"
    ],
    "allowJs": true,
    "checkJs": true,
    "module": "commonjs",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "declaration": true,
    "declarationDir": "./typings",
    "pretty": true,
    "sourceMap": true,
    "type":[],
    "jsx": "react",
    "baseUrl": "./node_modules",
    "paths": {
      "*": [
        "./@types/*/index.d.ts",
        "./@types/*/types.d.ts",
        "./*/index.d.ts",
        "./*/types.d.ts",
        "../types/*/index.d.ts"
      ]
    },
      "typeRoots": [
      "./@types",
      "../types",
      "../typings"
    ]
  },
"typeAcquisition": {
  "enable": true
},
  "include": [
    "src",
    "types"
  ],
  "exclude": [
    "node_modules"
  ]
}

jsconfig.json 与 tsconfig.json 相同，因此如果您想要使用依赖项中的某些类型，则需要安装它们并将它们添加到“type”数组中。

使用方式是，例如我们要使用express我们先添加

$ npm i -D @types/express

在我们添加 express 的 jsconfig 中的 "type":[] 数组中

...
"type":["express"]
...

现在在你的代码上

/**
 * @description
 * your desc
 * @type {import("express").RequestHandler} RequestHandler
 * @param {import("express").Request} req request
 * @param {import("express").Response} res response
 * @author Ernesto Jara Olveda
 * @copyright (C) 14
 */
export const renderLoginPage = (req, res) => {
    res.setHeader("Content-Type", "text/html; charset=uft-8");
    res.render("login.hbs", {
        canonical: "http://localhost:3000",
        theme: "theme-light",
        lang: "es",
        highlight: "highlight-red",
        gradient: "body-default",
        token: req.csrfToken(),
    });
};

如果你想引用的代码不是一个包，而是你的 src 文件夹中的一个文件，那么你有问题，它不能这样做。例如，您需要创建一个*.d.ts

src
--controller
----user
------user.js
------user.d.ts

让我们想象一下我们想要引用一些来自。 user.js 然后我们需要创建一个 user.d.ts 文件并添加所有它们的 user.js 定义您可以使用https://www.typescriptlang.org/play?#code 来帮助您，但正如您所看到的，您需要做很多事情。写下来。我建议你不要做所有在打字稿中创建项目的事情

enter image description here

【讨论】：