使用Angular 1.5.8和Webpack进行Auth0锁定

问题描述

我正在将Angular应用从gulp移植到Webpack和ES6.我正在使用auth0进行身份验证，并按照auth0中的教程进行操作:

I'm porting my Angular app from gulp over to Webpack and ES6. I'm using auth0 for authentication, and following the tutorial from auth0 here:

https://auth0.com/docs/quickstart/spa/angularjs

我的版本是:

• 角度1.5.8
• 角锁1.0.1
• auth0锁10.2.2

我正在苦苦挣扎的是我在加载应用程序时遇到的错误:

What I'm strugling with is this error I get when I'm loading up my app:

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

我有一个libraries.js文件，我在其中导入了所有依赖项:

I have a libraries.js file where I import all my dependencies:

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

在我的index.js中，我具有以下设置:

and in my index.js I have the following setup:

import './libraries';
import './app/home/home-component';
import './app/shared/security/authService';

module.exports = angular
    .module('app',
        ['ui.router', 'ui.bootstrap', 'auth0.lock', 'angular-jwt', 'app.homeModule', 'shared.authModule'])
    .config(configFunction)
    .run(runFunction);

我尝试将这个插件添加到我的webpack.config.js中，但是没有运气:

I have tried adding this plugin in my webpack.config.js with no luck:

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

关于如何使我的Auth0Lock加载到角度锁定之前的任何想法?我以为这是会发生的，因为我首先要重视它，但显然没有.

Any ideas of how I can make my Auth0Lock be loaded before the angular-lock loads? I thought that was going to happen since I important it first, but apperantly not.

非常感谢您的帮助.

推荐答案

我相信auth0-angular在窗口对象中寻找Auth0Lock.尝试通过更改为以下内容来更改全局变量的名称:

I believe auth0-angular looks for Auth0Lock in the window object. Try changing the name of the global variable by changing to:

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

这篇关于使用Angular 1.5.8和Webpack进行Auth0锁定的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！