0

While trying to use Twilio TaskRouter JS SDK on Vue JS, that you have load through CDN.

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
    <title><%= htmlWebpackPlugin.options.title %></title>
  </head>
  <body>
    <noscript>
      <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
    </noscript>
    <div id="app"></div>
    <!-- built files will be auto injected -->
    <script src="https://sdk.twilio.com/js/taskrouter/v1.21/taskrouter.min.js" integrity="sha384-5fq+0qjayReAreRyHy38VpD3Gr9R2OYIzonwIkoGI4M9dhfKW6RWeRnZjfwSrpN8" crossorigin="anonymous"></script>
  </body>
</html>

I want to init my worker like this:

export const initWorker = (token) => {
  return new Twilio.TaskRouter.Worker(token);
}

but it's giving me this error: 'Twilio' is not defined. but it's actually working and returning the Worker object. is there way to ignore or to say Vue js that I'm expecting Twilio?

AlfredoDaAs
  • 145
  • 1
  • 14

1 Answers1

1

Found a fix, you have to tell eslint that you'll have this as global, there are two ways to go:

add this before your variable call:

/* global Twilio */

or edit your eslint config:

'globals': {
    'Twilio': 'readable'
  },
AlfredoDaAs
  • 145
  • 1
  • 14