在 socket.io-client 中调用 IO 时出错，角度 8答案

【问题标题】：Getting error while calling IO in socket.io-client, angular 8在 socket.io-client 中调用 IO 时出错，角度 8
【发布时间】：2021-02-25 00:09:54
【问题描述】：

我在我的 Angular 项目中调用 socket.io-client 的 IO，如下所示：

import { Injectable } from '@angular/core';
import { Observable } from 'rxjs/internal/Observable';
import * as io from 'socket.io-client';
@Injectable({
  providedIn: 'root'
})
export class SocketclientService {
  socket:any;
  url:any="ws://localhost:8080"
  constructor() {
    this.socket = io(this.url);
   }
   
   listen(eventname:any,data:any){
     return new Observable((subscriber)=>{
       this.socket.on(eventname,(data:any)=>{
         subscriber.next(data);
       })
     })
   }
   emit(eventname:string,data:any){
     this.socket.emit(eventname,data);
   } 
}

但我总是收到如下错误：

 Error: src/app/services/socketclient.service.ts:11:19 - error TS2349: This expression is not callable.
      Type 'typeof import("C:/somepathtoproject/node_modules/socket.io-client/build/index")' has no call signatures.
    
    11     this.socket = io(this.url);
                         ~~

我不明白为什么会这样显示，即使我已经安装了@types/socket.io-client

【问题讨论】：

标签： angular socket.io

【解决方案1】：

角度 10 可以正常工作：

import {io} from 'socket.io-client';

这是官方文档 https://socket.io/docs/v3/client-api/index.html

【讨论】：

VSCode 给我以下警告：Module '"socket.io-client"' has no exported member 'io'.ts(2305) 但一切正常。
这应该是被接受的答案。完美运行
而且他还得把socket的类型改成socket：从同一个依赖中导入的socket。
@ViniciusArruda 和其他人：这是由手动安装的类型定义引起的。但它们现在包含在 npm 包中。所以只需删除它们：npm uninstall @types/socket.io-client.

【解决方案2】：

这可能是由单独安装的类型定义引起的。但它们现在随 socket.io-client 软件包一起提供 (see docs: "Note for TypeScript users")。

所以只需卸载它们并更改导入：

npm uninstall @types/socket.io-client

import { io, Socket } from 'socket.io-client';

【讨论】：

【解决方案3】：

我找到了一个解决方法，我稍微探索了 socket.io-client 模块，并在“index.d.ts”下找到了这一行：

export { lookup as io, Socket, SocketOptions };

所以我尝试这样导入：

import {io} from 'socket.io-client/build/index';

然后使用它：

this.socket=io(url);

它对我有用。

【讨论】：

【解决方案4】：

这是 2021 年更新的使用 Typescript 的方法：


import { io, Socket } from 'socket.io-client';

export default class SocketService {
  socket: Socket;

  constructor(conn) {
    this.socket = io(conn);
 
   (...)
  }
}

应该在括号内导入io，并使用Socket 类型的套接字也来自'socket.io-client'。

【讨论】：

【解决方案5】：

您的导入语句不正确，应该是这样的

import io from 'socket.io-client';

如果您查看type definition，您可以看到它被声明为

declare module 'socket.io-client' {
 export = io;
}

根据this的意思是它

export = 语法指定从模块导出的单个对象

如果我理解正确的话，它类似于需要上述导入语法的default export

【讨论】：

【解决方案6】：

即使我在过去 2 天也面临同样的问题，以下是我解决此问题的方法：

-> import * as io from 'socket.io-client'; //在新版本中出现错误，不知道为什么。

so use-> import {io} from 'socket.io-client'; //它不会抛出任何错误

1)首先错误是因为新版本的socket.io-client（即版本> 3.0-几天前发布）。所以尝试使用最稳定的。（我在客户端和服务器端都使用了 2.3.0） 2）确保您在客户端使用的套接字版本与服务器中使用的套接字版本匹配。

【讨论】：

我正在使用 const io= require('socket.io-client)
import {io} ... 正在解决这个问题 "Module '"socket.io-client"' has no export member 'io'.ts(2305)"
好的，这个问题只有在你安装了@types/socket.io-client 的情况下才会出现在打字稿上

【解决方案7】：

实际上，您的代码是正确的，但我相信您使用的是 socketIO 的更新版本，即 (3.0) 客户端。

使用以下版本：将条目粘贴到 package.json 中并运行 npm i。

**"socket.io-client": "2.2.0"**,

或者干脆删除早期版本并安装 2.0 版本。

$npm i socket.io-client@2.2.0 --save

【讨论】：

【解决方案8】：

为上述示例安装以下版本

$npm i socket.io-client@2.2.0 --save

【讨论】：

【解决方案9】：

将导入语句更改为

import {io} from 'socket.io-client';

适用于"socket.io-client": "^4.3.2" 及更高版本

开始连接时，使用以下语句：

    this.socket = io(< server url >, {query: { <your data object> });

在之前的版本中，查询键用于接受字符串和对象，现在显示字符串类型错误

【讨论】：