VSCode中JSDoc导入泛型类型提示无法解析问题求助

你的场景在VSCode的JSDoc类型提示中是完全可行的，问题出在泛型类型定义和导入的语法错误上，具体修正如下：

1. 修正render.js中的泛型类型定义 #

你之前的@template位置错误，必须放在@typedef之前，才能让JSDoc正确关联类型参数：

/**
 * @template T
 * @typedef {(item: T) => string} ItemRenderer
 */

/**
 * @template T
 * Render thing
 * @param {T} item thing to render
 * @returns {string} rendered thing
 */
export function render(item) {
  return item.toString();
}

2. 修正thing-list.js中的类型导入与使用 #

你之前的导入语法有误，正确的泛型类型导入格式是import('./模块路径').泛型类型名<T>，同时要确保Thing类型已定义：

import { render } from './render.js';

/**
 * @template T
 * @typedef {import('./render.js').ItemRenderer<T>} ItemRenderer
 */

// 先定义Thing类型（如果未在其他地方定义）
/**
 * @typedef {object} Thing
 * @property {string} name
 */

/**
 * @returns {ItemRenderer<Thing>} renderer
 */
function getRenderer() {
  return render;
}

/**
 * List Things
 * @param {Thing[]} list list of things
 * @param {ItemRenderer<Thing>} renderFn render function
 * @returns {string[]} rendered list
 */
function listThings(list, renderFn) {
  return list.map(renderFn);
}

// 示例调用
const list = [{ name: '测试对象' }];
listThings(list, getRenderer());

关键注意点 #

• @template必须位于@typedef的上方，否则VSCode无法识别泛型参数属于该类型
• 导入泛型类型时，import()的括号内仅放模块路径，泛型类型通过.访问并传入类型参数
• 导出的render函数也需要添加@template声明，保证其返回值类型与ItemRenderer的泛型一致

内容的提问来源于stack exchange，提问作者line-o