Lock: Typescript definition

[srollinet]

Is it planed to provide an official typescript definition file for use with frameworks like Aurelia or Angular2?

It seems that the definition on DefinitelyTyped is a bit outdated

[BenjaminGibbs]

I would also like to see this, we use a Typescript + Angular 1.5 at the moment and some up to date TS definitions would very welcome.

[valentinlup]

+1

[carusology]

Pull request in for v10 here. However, I have to say that figuring out what is public versus private right now is near impossible. I went with scientific "well, if it's listed in an example, it's public" approach. If there's something I missed that should be on the public API, make a comment on that pull request.

[carusology]

EDIT

DefinitivelyTyped accepted the pull request so I deleted my fork. Use the DefinitivelyTyped version now like so: typings install --save --global dt~auth0.lock

OLD COMMENT

This will work for now until they accept the pull request over at DefinitivelyTyped
typings install --save --global github:carusology/DefinitelyTyped/auth0.lock/auth0.lock.d.ts#14261aa459c36a258658d3c316eeedc9df8978c2

[mikeesouth]

@carusology thanks! Great work. I'm also trying to get Auth0-lock to work with TypeScript. I'm trying to use it with webpack and npm. Your definition works so that I pass the TypeScript compilation and I have an import statement for the auth0 module like this: import "auth0-lock"; but I get this error when I try to run my application: Uncaught ReferenceError: Auth0Lock is not defined.

I've also tried changing the import statement to import * as Auth0Lock from "auth0-lock"; and it still compiles but I get this error when I try to run my application: Uncaught TypeError: Auth0Lock is not a constructor.

I have a sample repo here that is forked from the official webpack example (that is using javascript, not typescript).

Does someone here have any idea on how I can import the auth0-lock package from npm and use it with TypeScript (+definitions)?

[carusology]

@mikeesouth Yeah, I ran into that issue with v9 of the auth0-lock as well. Here's what I did in my project to solve the problem:

1. Changing your import from import * as Auth0Lock from "auth0-lock"; to import Auth0Lock from "auth0-lock";
2. Set allowSyntheticDefaultImports to true in your tsconfig.json file.

[mikeesouth]

@carusology ah, thank you so much. It works. I've been at this issue for a while now :)

[carusology]

My changeset was merged into DefinitivelyTyped here.

This issue can be closed.

[matt-psaltis]

To save others from the same pain.

typings install dt~auth0-js --global
typings install dt~auth0.lock --global

the auth0 typings were renamed a few days ago to auth0-js !

This is working for me with Auth0 lock v10.2.1 in a Webpack Angular2 project.

[mashaalmemon]

Great job @carusology and @mikeesouth . After scouring the net, this got it all going. Many thanks.

@SaltyDH, coles notes also helpful re: auth0.js.

It might be helpful if the Auth0 folks updated their tutorials to reflect these nuggets of knowledge.

[hzalaz]

Closing this one, will update angular docs about it

[mikebridge]

@carusology Does this still work with the current auth-js type definitions? When importing @types/auth0-lock I'm getting these errors:

Failed to compile.

Error in C:\Temp\src\Web\node_modules\@types\auth0-lock\index.d.ts
(14,13): error TS2304: Cannot find name 'Auth0Error'.

Error in C:\Temp\src\Web\node_modules\@types\auth0-lock\index.d.ts
(20,13): error TS2304: Cannot find name 'Auth0Error'.

Error in C:\Temp\src\Web\node_modules\@types\auth0-lock\index.d.ts
(35,43): error TS2304: Cannot find name 'Auth0Error'.

Error in C:\Temp\src\Web\node_modules\@types\auth0-lock\index.d.ts
(36,51): error TS2304: Cannot find name 'Auth0Error'.

Error in C:\Temp\src\Web\node_modules\@types\auth0-lock\index.d.ts
(126,49): error TS2304: Cannot find name 'Auth0Error'.

Error in C:\Temp\src\Web\node_modules\@types\auth0-lock\index.d.ts
(126,70): error TS2304: Cannot find name 'Auth0UserProfile'.

Error in C:\Temp\src\Web\node_modules\@types\auth0-lock\index.d.ts
(127,50): error TS2304: Cannot find name 'Auth0Error'.

Error in C:\Temp\src\Web\node_modules\@types\auth0-lock\index.d.ts
(127,71): error TS2304: Cannot find name 'Auth0UserProfile'.

Error in C:\Temp\src\Web\node_modules\@types\auth0-lock\index.d.ts
(134,80): error TS2304: Cannot find name 'Auth0Error'.

Error in C:\Temp\src\Web\node_modules\@types\auth0-lock\index.d.ts
(6,1): error TS2688: Cannot find type definition file for 'auth0-js/v7'.

[carusology]

@mikebridge We ran into this too about a month ago. If I recall correctly, a DefinitivelyTyped contributor made a breaking change (represented as v8 of auth0-js), and the auth0-lock typings haven't been updated. What do your @types/* (i.e. @types/auth0-lock, @types/auth0-js, etc) dependencies look like in package.json?

[mikebridge]

@carusology I was pulling down the most recent one:

"@types/auth0-lock": "*"

Npm does not download the @types/auth0-js/v7 directory---I don't know enough of how it works to know why---but I was able to work around it by removing @types/auth0-lock and explicitly adding the dependency to @types/auth0-js in package.json:

"@types/auth0-js": "*"

... and then I copied your auth0-lock definitions locally, removed the 'v7' reference and added these lines:

/// <reference types="auth0-js" />

import Auth0Error = auth0.Auth0Error;
import Auth0UserProfile = auth0.Auth0Error;

This seems to be working so far.

[carusology]

@mikebridge Yeah, that's what I figured. Here's our types in project.json that uses the lock:

    "@types/auth0": "^2.3.33",
    "@types/auth0-js": "^7.0.0",
    "@types/auth0-lock": "10.9.0",

The key to getting the v7 version of the auth0-js typing is setting your @type/auth0-js dependency as "^7.0.0". You can see here that the most recent version is v8+.

Note that I'm not sure you'll need that raw auth0 typing... I wasn't the one who fixed this particular issue in our codebase.

[mikebridge]

@carusology Thanks! In the meantime it looks like there is now a pending commit to fix it.