Nuxt自定义socket插件报错：$socket不存在于CombinedVueInstance类型

云原生阿岚

2026-9-25

解决方案

1. 修正类型声明文件

你之前的声明仅覆盖了基础Vue实例类型，缺少Nuxt专属的类型扩展，完整声明如下，可直接替换原有vue-shim.d.ts内容，也可新建types/socket.d.ts单独存放：

提示：如果使用socket.io-client v4及以上版本，无需额外安装@types/socket.io-client，类型已内置；低于v4版本需要手动安装对应版本的类型包。

declare module "*.vue" {
  import Vue from 'vue'
  export default Vue
}

import { Socket } from "socket.io-client";

declare module 'vue/types/vue' {
  interface Vue {
    $socket: Socket;
  }
}

// 扩展Nuxt上下文和应用配置类型
declare module '@nuxt/types' {
  interface NuxtAppOptions {
    $socket: Socket;
  }
  interface Context {
    $socket: Socket;
  }
}

// 扩展组件选项类型，避免Props等合并时类型丢失
declare module 'vue/types/options' {
  interface ComponentOptions<V extends Vue> {
    $socket?: Socket;
  }
}

2. 校验tsconfig.json配置

确保你的tsconfig.json中include字段包含了声明文件所在的目录，参考配置如下：

{
  "compilerOptions": {
    "target": "ESNext",
    "module": "ESNext",
    "moduleResolution": "node",
    "strict": true,
    "types": ["@nuxt/types", "@types/node"]
  },
  "include": [
    "*.d.ts",
    "types/**/*.d.ts",
    "components/**/*.vue",
    "pages/**/*.vue",
    "plugins/**/*.ts"
  ]
}