时间戳

首页 > 解决方案 > 如何将jitsi meet融入aurelia

typescript - 如何将jitsi meet融入aurelia

问题描述

我正在尝试将Jitsi Meet集成并使用到我的 Aurelia 应用程序中，但到目前为止没有成功。我看到这个库不使用模块，也没有打字稿声明文件。在库 Github 文档页面上，它说只包含这样的脚本标签：

<script src='https://meet.jit.si/external_api.js'></script>

然后像这样调用api：

const domain = 'meet.jit.si';
const options = {
    roomName: 'JitsiMeetAPIExample',
    width: 700,
    height: 700,
    parentNode: document.querySelector('#meet')
};
const api = new JitsiMeetExternalAPI(domain, options);

问题是我找不到任何文章告诉我如何在 aurelia webpack 中使用标签也不知道将该标签放在哪里（intex，mycomponent.ts ...）最后我得到错误说打字稿找不到模块 JitsiMeetExternalAPI。

我将 Aurelia 与 typescript 和 WebPack 一起使用，但如果更容易使用，我可以更改为 requirejs。

请帮忙

更新： 我设法通过将其添加到 viewModel 来解决 tpescript 部分：

declare var JitsiMeetExternalAPI: any;

有了这个，我的代码编译没有错误。我在 index.ejs 文件的正文末尾添加了 cdn 脚本标记。所以我的 index.ejs 现在看起来像这样：

<html>
  <head>
    <meta charset="utf-8">
    <title><%- htmlWebpackPlugin.options.metadata.title %></title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <base href="<%- htmlWebpackPlugin.options.metadata.baseUrl %>">
  </head>
  <body aurelia-app="main">
    <script src='https://meet.jit.si/external_api.js'></script>
  </body>
</html>

我的页面如下所示：

<template>
  <div id="meet"></div>
</template>

当我现在启动应用程序时，我看到调用是对 jitsi 的 cdnscript 进行的，但随后我看到 aurelia-router 的错误，上面写着：

块引用

我究竟做错了什么？

标签： typescriptwebpackaureliascript-tag

解决方案

资助问题，来自 aurelia 的“appendChild”问题是因为它找不到 html 元素#meet，因为视图没有被喷射渲染。当我将 JitsiMeetExternalAPI 初始化移动到组件时，现在一切正常。

推荐阅读