How to import Javascript Library into Typescript/Webpack Aurelia CLI Project

Help Requests
1

I’m trying to implement ADAL to handle the authentication in my Aurelia app.

I’ve been trying to import the ‘adal-angular’ module (which is a javascript module to be used in an Authentication class to no avail.

image

I end up with this error:

Unhandled rejection Error: Error invoking AuthenticationContext. Check the inner error for details.------------------------------------------------Inner Error:Message: Cannot read property ‘displayCall’ of undefined

I’m relatively new to Aurelia development and I cannot figure this out. Any advice would be greatly appreciated.

1 Like
2

Update:

I npm installed type definitions “@types/adal-angular” in an attempt to solve this issue.

Now I’ve got:

image
image.png1207×155 10.5 KB

This is all very perplexing and I’m very much lost.

1 Like
3

from the docs

window.config = {
    clientId: '[Enter your client_id here, e.g. g075edef-0efa-453b-997b-de1337c29185]',
    popUp: true,
    callback : callbackFunction
};

var authContext = new AuthenticationContext(config);

function callbackFunction(errorDesc, token, error, tokenType)
{
}

you’re not providing the config param when injecting AuthenticationContext like that. unless you define a resolver:

// main.ts
import * as AuthenticationContext from "adal-angular";

const callbackFunction = () => {};
const config = {
clientId: "[Enter your client_id here, e.g. g075edef-0efa-453b-997b-de1337c29185]",
popUp: true,
callback: callbackFunction
};

export function configure(aurelia: Aurelia) {
  aurelia.container.registerInstance(
    AuthenticationContext,
    new AuthenticationContext(config)
  );
...
}
1 Like