无法在angular2中使用SystemJS加载phoenix js库

Question

我遵循了 Angular2 打字稿快速入门教程 (here)。

现在我正在尝试包含 phoenix.js 包，以便我可以连接到我的 Elixir Phoenix 频道。

我已经将 this package 的 phoenix 添加到我的 package.json 并安装了它。

我在 systemjs.config.js 中添加了一行，如下所示：

'phoenix': 'node_modules/phoenix/web/static/js/phoenix.js'

我正在尝试像这样将其导入我的 Angular2 服务（我使用的是 ES6 并已通读 this issue）：

import { Socket } from 'phoenix';

我收到错误

app/app.phoenix_channels.service.ts(2,24): error TS2307: Cannot find module 'phoenix'.

我实际上并不是 100% 确定 SystemJS 配置文件是如何包含的以及运行。它包含在应用程序之前的 HTML 中，但我在编译打字稿时看不到它被包含或解析。

我已经完成了这个但我不知道如何使用 Angular 教程提供的框架加载依赖项。

我尝试将 additional_deps 添加为 systemjs.config.js 的键，如下所示：

additional_deps: {
  src: 'node_modules/phoenix/priv/static/phoenix.js',
  inject: 'libs'
},

但这似乎不起作用。

我怎样才能加载这个依赖项，以便我可以从这个库中导入？

Answer 1

你有运行时的JS文件，但错误是编译错误，因为它正在寻找一个typescript文件。对于库，使用 TypeScript 定义文件，但有些库不支持 TypeScript，因此我们需要安装具有类型定义的外部模块。

有些JS项目你可能找不到定义文件，你需要自己写。或者您可以按照您链接到的答案中的张贴者所做的去做。只需声明随机 any 类型变量（不要导入）

declare var Socket: any;

现在您可以使用 Socket。但问题是您没有任何强类型或智能感知。

幸运的是，看起来有人为 phoenix 写了一个定义文件

npm install --save-dev @types/phoenix

这应该可以正常工作。就运行时而言，您的 SystemJS 配置看起来应该不错。

Cannot load phoenix js library with SystemJS in angular2