Question

我正在尝试将auth0实现到我的Angular 2项目中，我不想使用锁小部件，而是自定义我自己的登录表单和社交登录按钮。所以我想自己使用auth0-library。我希望它被捆绑，所以不要在index.html中导入它。

我使用CLI来构建我的项目（1.0.0-beta.11-webpack.2）并使用NPM安装auth0-js。我可以在node_modules中找到'auth0-js'文件夹，现在我只需要以某种方式将它连接到我的应用程序。

// login.component

import { Component } from '@angular/core';
import * as Auth0 from "auth0-js";

@Component({
  selector: 'app-login',
  templateUrl: 'login.component.html',
  styleUrls: ['login.component.css']
})
export class LoginComponent implements OnInit {

  auth0: any;

  constructor() {
    this.auth0 = new Auth0({
      domain: 'myDomain',
      clientID: 'myClientId',
      callbackURL: '{http://localhost:4000/}', // in dev-mode
      callbackOnLocationHash: true
    });
  }

  loginWithGoogle(connection) {
    this.auth0.login({
      connection: 'google-oauth2'
    });
  }
}

但是我从Webpack获得了这个控制台消息：

[默认]中的错误......... / node_modules/@types/auth0-js/index.d.ts'不是模块。

似乎应用程序正在运行，虽然打字不起作用。我安装了npm i @types/auth0-js --save，它按预期安装了我的节点模块。

看起来这种打字有问题，但是什么？这是我可以自己解决的问题，还是我必须等到有人将模板更新为模块化？

谢谢！

Answer 1

我没有使用过Auth0。但我认为这应该有用。

<强> main.ts

import 'auth0-js/standalone'; 

// Add this to test it.
var auth0 = new Auth0({
  domain:       'mine.auth0.com',
  clientID:     'dsa7d77dsa7d7',
  callbackURL:  'http://my-app.com/callback',
  responseType: 'token'
});

快速打字工作围绕src / typings.d.ts

declare var Auth0: any;

更好的打字方式：

安装auth0 typings https://www.npmjs.com/package/@types/auth0
更新您的tsconfig "types": ["auth0"]

使用Angular 2（RC5），Webpack和CLI的Auth0-js

1 个答案: