无法从“sockjs”导入(类型记录)

Question

我对棱镜和打字很陌生。

首先，我通过npm安装：

npm install --save sockjs-client

我正试图像这样在chat.component.ts中导入：

import * as SockJS from 'sockjs-client';

但是我发现了一个错误：

TS7016:找不到模块‘sockjs’的声明文件。'/home/simon/javaprojs/tour-creator/client/node_modules/sockjs-client/lib/entry.js‘隐式地具有“任意”类型。如果存在npm i --save-dev @types/sockjs-client或添加包含declare module 'sockjs-client';的新声明(.d.ts)文件，则重命名为declare module 'sockjs-client';

因此，在此之后，我尝试了如下错误建议：

npm i --save-dev @types/sockjs-client

但这只会导致一个新的警告：

/home/simon/javaprojs/tour-creator/client/src/app/components/chat/chat.component.ts依赖于‘sockjs’。CommonJS或AMD依赖项可以导致优化纾困。有关更多信息，请参见：https://angular.io/guide/build#configuring-commonjs-dependencies

这是我的组件的完整代码

import {Component, OnInit} from '@angular/core';

import * as Stomp from 'stompjs';
import * as SockJS from 'sockjs-client';

@Component({
  selector: 'app-chat',
  templateUrl: './chat.component.html',
  styleUrls: ['./chat.component.css'],
})
export class ChatComponent implements OnInit {

  constructor() { }

  connect(): void {
    const socket = new SockJS('gs-guide-websocket');
  }

  ngOnInit(): void {
    this.connect();
  }
}

该怎么办呢？当我启动应用程序时，我得到的只是一个白色页面，以及一个控制台错误，说明全局没有定义。

Answer 1

我不知道这是不是“最佳实践”，但它对我有用。

在index.html文件中，我只是通过标记加载SockJS。

然后在我的chat.component.ts顶部添加以下内容：

declare var SockJS: any;

Answer 2

请执行以下命令，然后重试。

npm install --save sockjs-client    
npm install --save @types/sockjs-client

npm audit fix

请加上这份声明

declare module 'sockjs-client';

您还可以访问以下链接：How to add SockJS into Angular 2 project?

Answer 3

实际上，为了从输入中获益，您需要导入默认值：

import SockJS from 'sockjs-client';