6

I am creating an app in which i require to implement Click To Call facility. So for communication I am using Twilio Client. I have tried this example.

Now all i need it i need to implement the same in my Angular 2 application. How can i import Twilio Client in my Typescript and how can i make use of it?

I am trying to import Twilio in my component like 

import * as Twilio from 'twilio'

but this is not correct method to import it.

The Hungry Dictator
  • 3,444
  • 5
  • 37
  • 53

2 Answers2

12

Twilio Developer Evangelist here. Right now we don't have any TypeScript bindings and therefore bundling like that won't work. I'm working on some bindings but in the mean time I would suggest you include the library like it's done in the demo application using a script tag. You can use our Twilio CDN for it:

  <script type="text/javascript" src="//media.twiliocdn.com/sdk/js/client/v1.3/twilio.min.js"></script>

Afterwards you have to let TypeScript know about it. For this you currently have to use declare const. Unfortunately this won't give you any of the neatness of TypeScript's type-checking until the bindings are done but it at least let's you use it. Just add the following line in the file where you are planning to consume the Twilio code:

declare const Twilio: any;

Hope that helps.

Cheers, Dominik

dkundel
  • 294
  • 2
  • 5
  • 1
    One thing i am looking for is App to App calling functionality. I am not getting any solution for that. – The Hungry Dictator Nov 09 '16 at 05:47
  • Hey Ronak! Check out the Twilio Client quickstart. This one works for both calling from the client to real phone numbers but also to other clients. – dkundel Nov 12 '16 at 18:27
  • You can find the code here: https://github.com/TwilioDevEd/client-quickstart-node. The import part are these lines on the server side: https://github.com/TwilioDevEd/client-quickstart-node/blob/master/index.js#L34-L54 – dkundel Nov 12 '16 at 18:28
  • Thank you for the response. – The Hungry Dictator Nov 15 '16 at 04:45
  • Any news about the typescript version? Thanks! – Eusthace May 18 '17 at 22:06
  • @Eusthace As of now no. Haven't heard of anything about that. – The Hungry Dictator Aug 17 '17 at 05:07
  • Can you pls tell me, how can we make use of Twilio constant variable which i declared in my component in an angular2 application? – Veena K. Suresh Oct 27 '17 at 10:42
  • I have the same problem, is there any news about the typescript version? – Vicruz Nov 22 '17 at 02:37
  • @dunkendel , I did the same as you suggest but always get undefined declare const Twilio: any; @Injectable() export class ChatService { private chatClient: any; subscribedChannels: any; constructor () { console.log(Twilio); console.log(Twilio.Chat); this.chatClient = Twilio.Chat.Client; } – Nathanphan Jan 22 '18 at 10:40
  • @dkundel Is there any updates on Twilio and typescript binding. Can I import twilio in my typescript now? BTW I'm using Angular5 – sayed saad Feb 18 '18 at 16:02
  • Hey @sayedsaad. Yes Twilio Chat is written in TypeScript by now so you should be able to just use it. Here is an example application that uses it: https://github.com/angular-berlin/ngry-chat/blob/master/src/app/core/twilio-chat.service.ts – dkundel Apr 11 '18 at 14:41
  • @dkundel Hi, is there any updates on Twilio Voice and typescript binding? Thanks. – morbilli Jul 31 '20 at 19:37
4

Now, when you install Twilio Client Library from npm (https://www.npmjs.com/package/twilio-chat), it has corresponding type definitions, so you can just write import { Client, User } from "twilio-chat";, then declare a Clientvariable in your component twilioClient: Client and create it:

Client.create(token).then(client => {
        this.twilioClient = client
});

Unfortunately there are no d.ts for twilio-common, so if you want to use something from it, like AccessManager, you need to do this like this, with all variables having any type:

let AccessManager = require('twilio-common').AccessManager;
let accessManager = new AccessManager(token);

EDIT: unfortunately, for some reason started getting responses for missing d.ts modules from 'twilio-chat' in dependent files, so it looks like this lib is not ready for using with TS yet:(.

MyUserName
  • 495
  • 2
  • 6
  • 24