auth0-samples / auth0-angularjs-sample

These samples are made up of steps to add Auth0 to an Angular JS app
28 stars 111 forks source link

Requirejs example #33

Open ashishtilara opened 7 years ago

ashishtilara commented 7 years ago

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

chenkie commented 7 years ago

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

ganeshkaspate commented 6 years ago

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

Ecarbone70 commented 6 years ago

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.

ganeshkaspate commented 6 years ago

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