Why imported Twilio in vuejs is invalid? - vuejs2

Question

I want to use twilio API to my vuejs2 app looking at demo https://github.com/TwilioDevEd/sdk-starter-node:
I added in in project with command
yarn add twilio
But I failed to create Twilio.Chat.Client with valid token, which I got from backendpoint,
as imported twilio object is invalid. In src/main.js I added line :
export const Twilio = require('twilio')
and in my vue page with code:
console.log('initializeChatClient token::')
console.log(token)
console.log('initializeChatClient id::')
console.log(id)
console.log('initializeChatClient channel::')
console.log(channel)
// const Twilio = require('twilio')
console.log('$twilio::')
console.log(Twilio)
console.log('$twilio.Chat::')
console.log(Twilio.Chat)
const client = await Twilio.Chat.Client.create(token)
I got error :
TypeError: Cannot read property 'Client' of undefined
and in console I see invalid twilio object : https://prnt.sc/w41cc7
What is wrong ?
package.json :
"axios": "^0.19.0",
"core-js": "^3.3.2",
...
"twilio": "^3.54.0",
"vue": "^2.6.10",
...
Thanks!

Answer 1

Based on your screenshot, Twilio actually contains a function.
Check out this file: https://github.com/TwilioDevEd/sdk-starter-node/blob/master/src/notification_handler.js:
There is this method that initialises the client using new Twilio(...):
function getTwilioClient() {
// Twilio Library
const client = new Twilio(
config.TWILIO_API_KEY,
config.TWILIO_API_SECRET,
{accountSid: config.TWILIO_ACCOUNT_SID}
);
...
}
Follow the same approach to initialise yours.