如何在VS Code的Angular工作流程中使用Pusher-JS？

Question

我从一家通过Pusher提供市场数据的公司获得了以下一小段JavaScript代码，并且它运作良好。

<script src="https://js.pusher.com/4.2/pusher.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
    var placeholder = document.getElementById('trades_placeholder'),
        pusher = new Pusher('xxxxxxxxxxxxxxxxxxxx'),
        tradesChannel = pusher.subscribe('live_trades');

    tradesChannel.bind('trade', function (data) {
        placeholder.innerHTML = "Price: " + data.price + "<br>Timestamp: " + data.timestamp;
    });
</script>

我正在尝试使其在Vs Code的Angular-TypeScript工作流程中运行，但我收到以下错误：

我已经通过npm安装了pusher-js。

这是包含我在Angular项目文件中创建的所有代码的图像，我用黄色标记了所有相关的Pusher-JS更改：

很明显，我错过了一些东西，但我无法弄清楚它是什么。下面我已经在zip中附加了JavaScript和Angular（只有相关的而不是整个项目）文件，所以你可以看看，遗憾的是我无法提供推送器的密钥号，但它没关系，因为我只需要知道如何正确设置项目。

ATTACHEMENT： JavaScript file and Angular TypeScript files ZIP

Answer 1

而不是：

import * as Pusher from 'pusher-js';

需要这样：

{{1}}

Answer 2

我认为我们需要告诉TypeScript Pusher作为全局变量存在，否则我们将从编译器中获得错误。将以下行添加到session.connect();

的顶部

app.component.ts: