Allow Auth0Lock to be passed as a provider parameter

[scotttrinh]

When using bundlers like webpack, browserify, and rollup, nothing is typically added to the global scope, so this bundling fails when looking for the global Auth0Lock. It seems that the old angular-auth0 package allowed you to optionally pass the lock constructor as a parameter to the init method. Why not continue to do that instead of requiring globals?

[wootencl]

+1 to this. That or some other way for this to be used in browserify and webpack

[wootencl]

@chenkie Any word or progress on this? Curious as I might try to fork and fix this issue. Will hold off though if it's something being already addressed by the Auth0 team.

[chenkie]

Nothing yet @wootencl, please feel free to send a PR :)

[wootencl]

Cool deal. So I did a little digging and figured out the remedy to this situation would be simply adding back the standalone.js file to auth0-lock. With that we can require it to be used in the browserify bundle. Though it makes me ask why it was removed (or maybe forgotten) in the new version of Lock as I know for fact it exists in lock v9?

With that said I can make a PR on auth0-lock with the new standalone.js file if there isn't any issue with that. Should be relatively straightforward.

[scotttrinh]

@wootencl I was thinking the more straightforward solution would be to pass the Auth0 constructor to the init function like the old angular-lock library used to do, was that not feasible?

[wootencl]

@scotttrinh That also seems like a fairly straightforward solution. Honestly I think both are of relatively equal complexity. Mostly just copying code from the old repos and modifying it to work with the new version. Honestly either works for me. As long as I can get rid of the CDN link in my index.html I'll be happy. Could let @chenkie decide I suppose...

[freefony]

any update on this? am stocked with same issue. plus why did i add the CDN link and still have this error. @wootencl please is their a temp fix you ve used for this?

[scotttrinh]

Seems like letting someone on the Auth0 team make the call between both choices is the right move. Thanks for looking into it!

[wootencl]

@freefony A temporary workaround would be to create your own standalone.js file that you require at the top of your index.js file. Here's copy pasta from lock v9 standalone.js that works for lock v10:

//standalone.js
var old_define = global.define;
global.define = undefined;

var Auth0Lock = require('auth0-lock').default;

//restore define
global.define = old_define;

// use amd or just throught to window object.
if (typeof global.define == 'function' && global.define.amd) {
  global.define('auth0-lock', function () { return Auth0Lock; });
} else if (global) {
  global.Auth0Lock = Auth0Lock;
}

[freefony]

Thanks @wootencl ! am using rollup for bundling how so i have to translate this to what rollup understands. i ll post my solution once i find one

[freefony]

i am using rollup commonjs plugin so i added auth0-lock to namedExport and it worked without needing the standalone.js file.

// rollup.config.js
plugins: [
    builtins(),
    commonjs({
      namedExports: {
        ........
        'node_modules/auth0-lock/lib/indexjs': ['auth0-lock']
      }
    }),```

[scotttrinh]

@freefony Does that solve adding Auth0Lock as a global so angular-lock finds it here?

[freefony]

I think it is due the way the modules are exported; while module bundlers can handle a direct export default [module-name] but when this is coming from a dependency they throw errors. I had the same problem using pouchdb. while pouchdb was imported, no problem, a dependency js-extension failed to load so i had to add it as a namedExport to the rollup commonjs plugin to force it to load. if you look at the node_modules/lib/index.js you will find same style of export. ln 45 var Auth0Lock = function (_Core) { and exported on ln 60 exports.default = Auth0Lock; and remember auth0-lock module is not imported directly but as a dependency of angular2-jwt so the error. NB: am using auth0-lock.js not angular-lock.js

[trcolgrove]

+1 need this functionality to work with browserify

edit: got it to work using window.Auth0Lock = require('auth0-lock').default

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. If you have not received a response for our team (apologies for the delay) and this is still a blocker, please reply with additional information or just a ping. Thank you for your contribution! 🙇‍♂️