2016-11-01 15 views
1

私はwebpackにバンドルしているAngularプロジェクトにAuth0を統合しようとしています。私はアプリを起動すると、私はエラーを取得する:Auth0とAngular 1.5.8とwebpack

Error: [$injector:modulerr] Failed to instantiate module auth0.lock due to: 
Error: Auth0Lock must be loaded. 

私config.jsのは、次のようになります。

import 'auth0-lock'; 
import 'angular-lock'; 
import 'angular-jwt'; 

import angular from 'angular'; 
import uiRouter from 'angular-ui-router'; 
import loginController from 'components/login/login.controller'; 
import authService from 'shared/auth/auth.service'; 


const app = angular.module('app',[uiRouter, 'auth0.lock', 'angular-jwt']); 

app.config(($stateProvider, lockProvider, $urlRouterProvider, $locationProvider) => { 
    $urlRouterProvider.otherwise('/'); 

    $stateProvider 
     .state('login',{ 
      url:'/login', 
      template: require('components/login/login.view.html'), 
      controller: loginController, 
      controllerAs: 'vm' 
     }) 

    lockProvider.init({ 
     clientID: 'xxx', 
     domain: 'xxx' 
    }); 

    $locationProvider.html5Mode(true); 
}); 

app.service('authService',authService); 

export default app; 

そして、私のindex.js私が上で読んだ

import angular from 'angular'; 
import appModule from './config'; 
angular.bootstrap(document, [appModule.name]); 

run.$inject = ['$rootScope', 'authService', 'lock']; 

function run($rootScope, authService, lock) { 
    // Put the authService on $rootScope so its methods 
    // can be accessed from the nav bar 
    $rootScope.authService = authService; 

    // Register the authentication listener that is 
    // set up in auth.service.js 
    authService.registerAuthenticationListener(); 

    // Register the synchronous hash parser 
    lock.interceptHash(); 

    console.log('success'); 
} 

ですいくつかの場所は、webpack設定のwindow.Auth0Lockを設定するとそれを修正するが、まだ運がない。

new webpack.ProvidePlugin({ 
    "window.Auth0Lock" : "auth0-lock" 
}), 

私の問題はthis questionと全く同じであるが、それは未解決のまま悲しいかな。私はどんな助けも飾るだろう。

編集:以下の解決策は私の問題を解決してくれないようだが、私はまだ立ち往生している。私はすべての必要な依存関係を必要としていると信じています。

答えて

1

私はlock.min.jsが必要です。私が設定ファイルでそれを要求しようとしたとき、webpackはスローアップします。私もダウンロードしようとし、配布可能を要求しても、それは私に問題を与えていた。私はあきらめましたが、今私はindex.htmlで直接CDNを参照しています。私はあなたもwebpackスクリプトローダーを使うことができると思います。

<script type="text/javascript" src="https://cdn.auth0.com/js/lock/10.5/lock.min.js"></script> 
    <script src="bundle.js"></script> 

これが役立ちます。