VS Code如何为拆分到独立文件的Node.js路由参数启用代码补全

核心思路是手动给路由配置或者handler参数标注对应框架的官方类型，让IntelliSense可以识别参数类型，恢复补全提示。下面分不同开发场景给出具体方案：

场景1：纯JavaScript项目 #

首先安装对应框架的类型声明包作为开发依赖（以你当前使用的Hapi.js为例，其他框架逻辑通用）：

npm i -D @types/hapi__hapi

方案1：给整个路由数组标注类型（推荐） #

在routes.js的导出数组上方加JSDoc注释标注类型，后续所有路由的handler参数都会自动获得提示：

// routes.js
/**
 * @type {import('@hapi/hapi').ServerRoute[]}
 */
module.exports = [
    {
        path: '/some/path',
        method: 'GET',
        handler: (request, reply) => {
            // 此处request、reply已自动获得完整智能提示
            return reply.response('trick or treat');
        }
    }
];

方案2：单独给单个handler的参数标注类型 #

如果只需要给个别路由加提示，可以单独给参数加JSDoc标注：

// routes.js
module.exports = [
    {
        path: '/some/path',
        method: 'GET',
        handler: (
            /** @type {import('@hapi/hapi').Request} */ request,
            /** @type {import('@hapi/hapi').ResponseToolkit} */ reply
        ) => {
            return reply.response('trick or treat');
        }
    }
];

场景2：TypeScript项目 #

直接导入框架的路由类型标注即可：

// routes.ts
import type { ServerRoute } from '@hapi/hapi';

const routes: ServerRoute[] = [
    {
        path: '/some/path',
        method: 'GET',
        handler: (request, reply) => {
            return reply.response('trick or treat');
        }
    }
];

export default routes;

其他框架通用逻辑 #

如果你用的是Express、Koa等其他Node.js后端框架，操作逻辑完全一致：

• Express：导入Request、Response、Router类型标注
• Koa：导入Context、Next类型标注
  对应类型都可以在官方的@types/[框架名]包中获取，标注后即可恢复智能提示。

内容的提问来源于stack exchange，提问作者Tropang Potchi