无法在 angular 项目中导入 socket.io-client

Can't import socket.io-client in angular project

我正在尝试将 socket.io-client 导入到我的项目中,但是导入行

import * as io from 'socket.io-client';

抛出以下错误

ERROR in C:/Users/USER/Desktop/VSCProjects/CellularAss8/client/node_modules/socket.io-client/build/typed-events.d.ts (30,204): '>' expected.
ERROR in C:/Users/USER/Desktop/VSCProjects/CellularAss8/client/node_modules/socket.io-client/build/typed-events.d.ts (30,239): '(' expected.
ERROR in C:/Users/USER/Desktop/VSCProjects/CellularAss8/client/node_modules/socket.io-client/build/typed-events.d.ts (30,260): ',' expected.
ERROR in C:/Users/USER/Desktop/VSCProjects/CellularAss8/client/node_modules/socket.io-client/build/typed-events.d.ts (30,265): ',' expected.
ERROR in C:/Users/USER/Desktop/VSCProjects/CellularAss8/client/node_modules/socket.io-client/build/typed-events.d.ts (30,296): '(' expected.
ERROR in C:/Users/USER/Desktop/VSCProjects/CellularAss8/client/node_modules/socket.io-client/build/typed-events.d.ts (30,313): ',' expected.
ERROR in C:/Users/USER/Desktop/VSCProjects/CellularAss8/client/node_modules/socket.io-client/build/typed-events.d.ts (30,321): Expression expected.
ERROR in C:/Users/USER/Desktop/VSCProjects/CellularAss8/client/node_modules/socket.io-client/build/typed-events.d.ts (37,49): ';' expected.
ERROR in C:/Users/USER/Desktop/VSCProjects/CellularAss8/client/node_modules/socket.io-client/build/typed-events.d.ts (37,92): Expression expected.
ERROR in C:/Users/USER/Desktop/VSCProjects/CellularAss8/client/node_modules/socket.io-client/build/typed-events.d.ts (21,86): Cannot find name 'Parameters'.
ERROR in C:/Users/USER/Desktop/VSCProjects/CellularAss8/client/node_modules/socket.io-client/build/typed-events.d.ts (30,212): 'EventNames' only refers to a type, but is being used as a value here.
ERROR in C:/Users/USER/Desktop/VSCProjects/CellularAss8/client/node_modules/socket.io-client/build/typed-events.d.ts (30,241): Cannot find name 'ReservedEvents'.
ERROR in C:/Users/USER/Desktop/VSCProjects/CellularAss8/client/node_modules/socket.io-client/build/typed-events.d.ts (30,256): Cannot find name 'Ev'.
ERROR in C:/Users/USER/Desktop/VSCProjects/CellularAss8/client/node_modules/socket.io-client/build/typed-events.d.ts (30,262): Cannot find name 'Ev'.
ERROR in C:/Users/USER/Desktop/VSCProjects/CellularAss8/client/node_modules/socket.io-client/build/typed-events.d.ts (30,273): 'EventNames' only refers to a type, but is being used as a value here.
ERROR in C:/Users/USER/Desktop/VSCProjects/CellularAss8/client/node_modules/socket.io-client/build/typed-events.d.ts (30,298): Cannot find name 'UserEvents'.
ERROR in C:/Users/USER/Desktop/VSCProjects/CellularAss8/client/node_modules/socket.io-client/build/typed-events.d.ts (30,309): Cannot find name 'Ev'.
ERROR in C:/Users/USER/Desktop/VSCProjects/CellularAss8/client/node_modules/socket.io-client/build/typed-events.d.ts (30,315): Cannot find name 'never'.
ERROR in C:/Users/USER/Desktop/VSCProjects/CellularAss8/client/node_modules/socket.io-client/build/typed-events.d.ts (37,58): Cannot find name 'never'.
ERROR in C:/Users/USER/Desktop/VSCProjects/CellularAss8/client/node_modules/socket.io-client/build/typed-events.d.ts (37,94): Cannot find name 'T'.
ERROR in C:/Users/USER/Desktop/VSCProjects/CellularAss8/client/node_modules/socket.io-client/build/typed-events.d.ts (51,31): Class 'StrictEventEmitter<ListenEvents, EmitEvents, ReservedEvents>' incorrectly extends base class 'Emitter<string>'.
  Types of property 'on' are incompatible.
    Type '<Ev extends ReservedOrUserEventNames<ReservedEvents, ListenEvents>>(ev: Ev, listener: [Ev]) => this' is not assignable to type '(event: string, listener: Function) => Emitter<string>'.
      Types of parameters 'listener' and 'listener' are incompatible.
        Type 'Function' is not assignable to type '[any]'.
          Property '0' is missing in type 'Function'.
ERROR in C:/Users/USER/Desktop/VSCProjects/CellularAss8/client/node_modules/socket.io-client/build/typed-events.d.ts (72,53): A rest parameter must be of an array type.
ERROR in C:/Users/USER/Desktop/VSCProjects/CellularAss8/client/node_modules/socket.io-client/build/typed-events.d.ts (82,75): A rest parameter must be of an array type.
ERROR in C:/Users/USER/Desktop/VSCProjects/CellularAss8/client/node_modules/socket.io-client/build/socket.d.ts (48,9): An accessor cannot be declared in an ambient context.
ERROR in C:/Users/USER/Desktop/VSCProjects/CellularAss8/client/node_modules/socket.io-client/build/socket.d.ts (73,53): A rest parameter must be of an array type.
ERROR in C:/Users/USER/Desktop/VSCProjects/CellularAss8/client/node_modules/socket.io-client/build/socket.d.ts (184,9): An accessor cannot be declared in an ambient context.

仔细研究后,我发现在 angular 调试模式下,如果我注释掉导入行,保存、取消注释并在调试模式下完美保存代码 运行。

有没有办法修复它,这样导入就可以在没有我上面提到的步骤的情况下工作?

Angular版本为4.4.6 socket.io-客户端版本为 1.7.3

这里是 tsconfig.json 文件

{
  "compileOnSave": false,
  "compilerOptions": {
    "esModuleInterop": true,
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "target": "es5",
    "typeRoots": ["node_modules/@types"],
    "lib": ["es2017", "dom"]
  },
  "allowSyntheticDefaultImports": true
}

我不确定你提到的问题,但我可以提供解决方法。

在使用 Angular 和 Socket.io 时,您可以尝试使用此包 https://www.npmjs.com/package/ngx-socket-io。我过去用过它,效果很好,它可能会解决你的问题。

只需安装然后配置即可。类似于:

import { SocketIoModule, SocketIoConfig } from 'ngx-socket-io';

const config: SocketIoConfig = { url: 'http://localhost:8988', options: {} };

@NgModule({
  declarations: [AppComponent],
  imports: [BrowserModule, SocketIoModule.forRoot(config)],
  bootstrap: [AppComponent],
})
export class AppModule {}

您使用的不是 1.7.3 版的 socket.io-客户端,而是 ^4.1.3 版。由于其打包的类型定义文件,事实上创建了对 typescript 4 的依赖,但您的项目使用 typescript ~2.3.3 编译。因此你得到的错误。

确保使用 npm i -S socket.io-client@1.7.3 安装正确的版本。它没有打包自己的类型定义(因此它不依赖于打字稿),所以你还需要安装 @types/socket.io-client@1 来获取类型。