twilio / twilio-video.js

Twilio’s Programmable Video JavaScript SDK
https://www.twilio.com/docs/video/javascript
Other
571 stars 217 forks source link

error TS2339: Property 'on' does not exist on type 'Room'. Angular 11 server and build #1333

Closed lautarobock closed 3 years ago

lautarobock commented 3 years ago

Code to reproduce the issue:

import { RemoteParticipant, Room, connect, createLocalTracks } from 'twilio-video';

connect(this.token, { name: 'This is the room name', audio: true, video: true }).then(room => {
   room.on('participantConnected', (participant: RemoteParticipant) => {
          // other code here
    });
});

Expected behavior:

Run the web application successful

Actual behavior:

Error: src/app/views/video/video-room/video-room-media.component.ts:73:14 - error TS2339: Property 'on' does not exist on type 'Room'.   

73         room.on('participantConnected', (participant: RemoteParticipant) => {

Software versions:

package.json

{
  "name": "drtech-web",
  "version": "0.0.0",
  "license": "MIT",
  "scripts": {
    "ng": "ng",
    "start:secure": "ng serve --ssl --ssl-key ~/localhost.key --ssl-cert ~/localhost.crt  --proxy-config proxy.conf.json --prod",
    "start": "ng s",
    "start:proxy": "ng serve --proxy-config proxy.conf.json",
    "build": "ng build --prod",
    "prod": "ng build --prod --base-href \"http://www.ifn.com.ar/pacientes/\"",
    "test": "ng test",
    "lint": "ng lint",
    "lint:fix": "ng lint drtech-web --fix",
    "e2e": "ng e2e",
    "postinstall": "ngcc"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "^11.0.5",
    "@angular/cdk": "^11.0.3",
    "@angular/common": "^11.0.5",
    "@angular/compiler": "^11.0.5",
    "@angular/core": "^11.0.5",
    "@angular/flex-layout": "^11.0.0-beta.33",
    "@angular/forms": "^11.0.5",
    "@angular/material": "^11.0.3",
    "@angular/platform-browser": "^11.0.5",
    "@angular/platform-browser-dynamic": "^11.0.5",
    "@angular/router": "^11.0.5",
    "@angular/service-worker": "^11.0.5",
    "@ngx-loading-bar/http-client": "^2.0.0",
    "@ngx-loading-bar/router": "^2.0.0",
    "big-integer": "^1.6.32",
    "js-zxing-pdf417": "git+https://github.com/PeculiarVentures/js-zxing-pdf417.git",
    "jsreport-browser-client-dist": "^1.1.0",
    "lodash": "^4.17.19",
    "moment": "^2.22.2",
    "ng2-file-upload": "^1.3.0",
    "ng2-pdf-viewer": "^5.2.0",
    "ngx-lightbox": "^2.2.2",
    "ngx-moment": "^5.0.0",
    "ngx-perfect-scrollbar": "^6.1.0",
    "rollbar": "^2.7.0",
    "rxjs": "^6.6.3",
    "screenfull": "^3.3.2",
    "tslib": "^2.0.0",
    "twilio-video": "^2.10.0",
    "ua-parser-js": "^0.7.21",
    "zone.js": "~0.10.2"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.1100.5",
    "@angular/cli": "^11.0.5",
    "@angular/compiler-cli": "^11.0.5",
    "@angular/language-service": "^11.0.5",
    "@types/google.analytics": "0.0.40",
    "@types/jasmine": "~3.6.0",
    "@types/jasminewd2": "~2.0.2",
    "@types/lodash": "^4.14.109",
    "@types/node": "^12.11.1",
    "@types/screenfull": "^3.3.1",
    "@types/twilio-video": "^2.7.3",
    "@types/ua-parser-js": "^0.7.33",
    "codelyzer": "^6.0.0",
    "jasmine-core": "~3.6.0",
    "jasmine-spec-reporter": "~5.0.0",
    "karma": "~5.1.1",
    "karma-chrome-launcher": "~3.1.0",
    "karma-coverage-istanbul-reporter": "~3.0.2",
    "karma-jasmine": "~4.0.0",
    "karma-jasmine-html-reporter": "^1.5.0",
    "node-sass": "^4.13.1",
    "protractor": "~7.0.0",
    "ts-node": "^8.3.0",
    "tslint": "~6.1.0",
    "typescript": "4.0.5"
  }
}
austinbuckler commented 3 years ago

I solved this by adding @types/events to devDependencies