Vuejs에 Jitsi Meet을 추가하는 방법

Vuejs에 Jitsi Meet을 추가하는 방법

jitsi meet 스크립트를 public.html 본문에 로드하여 다음과 같은 컴포넌트가 있습니다.

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

<script>
export default {
  name: "ServiceMeet",
  mounted() {
    const domain = "meet.jit.si";
    const options = {
      roomName: "PickAnAppropriateMeetingNameHere",
      width: 700,
      height: 700,
      parentNode: document.querySelector("#meet"),
    };
    const api = new JitsiMeetExternalAPI(domain, options);
    console.log(api.getVideoQuality());
  },
};
</script>

달리기를 시도하면 다음과 같은 오류가 발생합니다.18:21 error 'JitsiMeetExternalAPI' is not defined no-undef다만, 백그라운드에서 미팅이 정상적으로 동작하고 있는 것을 알 수 있기 때문에, 에러를 수정하거나 해제를 실시합니다.

보풀 오류를 비활성화할 수 있지만 글로벌 변수로 지정할 것을 권장합니다.

.eslintrc.js

module.exports = {
  globals: {
    JitsiMeetExternalAPI: true
  }
}

글로벌에 프리픽스를 붙이면 동작합니다.window:

const api = new window.JitsiMeetExternalAPI(domain, options);

언급URL : https://stackoverflow.com/questions/64915112/how-to-add-jitsi-meet-to-vuejs