auth0-angularjs-sample icon indicating copy to clipboard operation
auth0-angularjs-sample copied to clipboard

Requirejs example

Open ashishtilara opened this issue 9 years ago • 4 comments

I am trying to use this example with Requirejs but doesn't seem to have any luck... It keeps on throwing

Failed to instantiate module auth0.auth0 due to:
ReferenceError: Auth0 is not defined

Is it possible to get an example using RequireJS, I also tried to use example of angular-lock but that also throws similar error about Auth0Lock is not defined.

Following is my require.config, not sure what I am doing wrong here...

require.config({
    "paths": {
      "jquery": "node_modules/" + "jquery/dist/jquery.min",
      "angular": "node_modules/" + "angular/angular.min",
      "ngRoute": "node_modules/" + "angular-route/angular-route.min",
      "lodash": "node_modules/" + "lodash/lodash",
      "bootstrap": "node_modules/" + "bootstrap/dist/js/bootstrap.min",
      "ui.bootstrap": "node_modules/" + "angular-ui-bootstrap/dist/ui-bootstrap-tpls",
      "auth0": "bower_components/" + "auth0.js/build/auth0",
    "auth0.auth0":"bower_components/" + "angular-auth0/dist/angular-auth0",
    "angular-jwt":"bower_components/" + "angular-jwt/dist/angular-jwt",

      "domReady": "node_modules/" + "requirejs-domReady/domReady",
      "SYS.Controllers": "js/controllers/" + "controllers",
      "SYS.Service.Auth": "js/services/" + "SYS.Service.Auth"
    },
    "shim": {
      "angular": {
        "exports": "angular"
      },
      "ngRoute": {
        "deps": ["angular"]
      },
      "bootstrap": {
        "deps": ["jquery"]
      },
      "ui.bootstrap": {
        "deps": ["angular", "bootstrap"]
      },
      "lodash": {
        "exports": "_"
      },
      "auth0": {
        "exports": "Auth0"
      },
      "auth0.auth0": {
        "deps": ["angular", "auth0"]
      },
      "angular-jwt": {
        "deps": ["angular"]
      }
    }
  });

I would appreciate any help regarding fixing this.

cheers Ashish

ashishtilara avatar Oct 05 '16 12:10 ashishtilara

@ashishtilara this issue has some solutions around bundling that might be of some help: https://github.com/auth0/angular-lock/issues/3

chenkie avatar Oct 12 '16 16:10 chenkie

Hey, I am facing the same issue @ashishtilara . Did u find any solution for this ?

ganeshkaspate avatar May 31 '18 07:05 ganeshkaspate

Hi, i repost this i wrote : After some test i found this simply workaround, i will show, waiting for a better solution. I write a simple preauth0.js file in scripts directory (when i put libraries):

define(function (require) {
    auth0 = require('auth0-js'); 
});

then in require.config:

....
 "auth0-js": "scripts/auth0.min",
        "preauth0":"scripts/preauth0",
        "auth0.auth0": "scripts/angular-auth0.min",
...
 "auth0-js": {
       "exports": "Auth0"
   },
   "auth0.auth0": {
       "deps": ["angular", "auth0-js","preauth0"]
   },
....

So i could simply call auth0auth0 in app.js


define(['angularAMD', 'angular',  'auth0.auth0', 'angular-route', ...], function (angularAMD) {
    var app = angular.module('Testapp', [.., 'auth0.auth0']);

and go on with provider as the tutorial explains. I haven't found any other solution for this, so i hope that this, maybe not perfect, would help someone else, waiting for better.

Ecarbone70 avatar May 31 '18 08:05 Ecarbone70

I used this way. Now auth0 not defined error is not there. Now i am getting Uncaught Error: Auth0 must be loaded. at Object.module.exports (angular-auth0.js:84) at webpack_require (angular-auth0.js:20) at Object.defineProperty.value (angular-auth0.js:63) at angular-auth0.js:66 This error

ganeshkaspate avatar May 31 '18 09:05 ganeshkaspate