将Auth0锁导入Meteor 1.3中的React组件

Question

我正在设置一个新的Meteor 1.3项目，但在集成Auth0时遇到了问题。我正在学习教程here，但为了让事情变得更复杂，我使用了ES2015模块和React，所以我会边走边翻译。

在运行meteor add auth0:lock之后，教程告诉我应该在客户机上运行以下JS：

Template.Auth0Login.events({
  'click button.login'(event, instance) {
    lock.show();
  },
}

所以我的app/imports/ui/components/Navbar.jsx文件看起来像这样：

1| import React, {Component} from 'react';
2| 
3| export default class Navbar extends Component {
4|   render() {
5|     return (
6|       <button class='signin' onClick={lock.show()}>Sign In</button>
7|      )
8|   }
9| }

呈现的页面为空，并显示以下控制台错误：

Uncaught TypeError: Cannot read property 'show' of undefined

如果删除onClick={lock.show()}，则会显示该按钮。这就说得通了，- how在不导入的情况下，它能知道“锁”是什么吗？因此，我在Auth0 React tutorial上找到了一个导入行，并将其放入：

1| import React, {Component} from 'react';
2| import Auth0Lock from 'auth0-lock';
3| 
4| export default class Navbar extends Component {
5|   ...

导致以下控制台错误：

Uncaught Error: Cannot find module 'auth0-lock'

我尝试将导入的模块重命名为auth0:lock，以代替meteor包，但无济于事。

有人知道如何将Lock导入到给定的React组件中，以便可以使用这些函数吗？还是有别的办法？

非常感谢!

Answer 1

你看过这个吗：https://auth0.com/docs/libraries/lock？

    // Initialize Auth0Lock with your `clientID` and `domain`
    var lock = new Auth0Lock('xxxxxx', '<account>.auth0.com');