Question

我已经成功将AWS Amplify的Auth UI功能和组件与Gridsome集成在一起，以实现简单的登录/注销功能，但是当我尝试通过以下方式访问Amplify事件总线时

import { AmplifyEventBus } from "aws-amplify-vue"

我得到了错误：

Error in mounted hook (Promise/async): "TypeError: Cannot read property 'Logger' of undefined"

我发现了类似的问题on the github post，并添加了建议的

Vue.prototype.$Amplify = Amplify;

确实删除了警告，但是Auth UI注销组件将不再显示。我可以登录，但没有显示“注销”按钮。我不明白为什么在UI组件已经可以使用Amplify的情况下，如果没有UI组件就可以访问事件总线，以及为什么即使我添加了Amplify组件也仍然不出现。

Answer 1

2020-06-25T14:07:26.103630+00:00 heroku[router]: at=info method=GET path="/dashboard" host=chuckaboo-posts-app.herokuapp.com request_id=f1a4a317-22bb-4089-bb0b-fb45b9c0bec1 fwd="80.0.174.220" dyno=web.1 connect=0ms service=7ms status=302 bytes=267 protocol=https 2020-06-25T14:07:26.153771+00:00 app[web.1]: Error: Failed to lookup view "Login" in views directory "/app/views" 2020-06-25T14:07:26.153784+00:00 app[web.1]: at Function.render (/app/node_modules/express/lib/application.js:580:17) 2020-06-25T14:07:26.153785+00:00 app[web.1]: at ServerResponse.render (/app/node_modules/express/lib/response.js:1012:7) 2020-06-25T14:07:26.153786+00:00 app[web.1]: at ServerResponse.res.render (/app/node_modules/express-ejs-layouts/lib/express-layouts.js:77:18) 2020-06-25T14:07:26.153786+00:00 app[web.1]: at /app/routes/users.js:7:9 2020-06-25T14:07:26.153787+00:00 app[web.1]: at Layer.handle [as handle_request] (/app/node_modules/express/lib/router/layer.js:95:5) 2020-06-25T14:07:26.153787+00:00 app[web.1]: at next (/app/node_modules/express/lib/router/route.js:137:13) 2020-06-25T14:07:26.153787+00:00 app[web.1]: at Route.dispatch (/app/node_modules/express/lib/router/route.js:112:3) 2020-06-25T14:07:26.153787+00:00 app[web.1]: at Layer.handle [as handle_request] (/app/node_modules/express/lib/router/layer.js:95:5) 2020-06-25T14:07:26.153788+00:00 app[web.1]: at /app/node_modules/express/lib/router/index.js:281:22 2020-06-25T14:07:26.153788+00:00 app[web.1]: at Function.process_params (/app/node_modules/express/lib/router/index.js:335:12) 2020-06-25T14:07:26.153789+00:00 app[web.1]: at next (/app/node_modules/express/lib/router/index.js:275:10) 2020-06-25T14:07:26.153789+00:00 app[web.1]: at Function.handle (/app/node_modules/express/lib/router/index.js:174:3) 2020-06-25T14:07:26.153790+00:00 app[web.1]: at router (/app/node_modules/express/lib/router/index.js:47:12) 2020-06-25T14:07:26.153790+00:00 app[web.1]: at Layer.handle [as handle_request] (/app/node_modules/express/lib/router/layer.js:95:5) 2020-06-25T14:07:26.153790+00:00 app[web.1]: at trim_prefix (/app/node_modules/express/lib/router/index.js:317:13) 2020-06-25T14:07:26.153791+00:00 app[web.1]: at /app/node_modules/express/lib/router/index.js:284:7 2020-06-25T14:07:26.158370+00:00 heroku[router]: at=info method=GET path="/users/login" host=chuckaboo-posts-app.herokuapp.com request_id=583c0fb1-a6eb-4f0f-bfc7-55c4fe07dbc3 fwd="80.0.174.220" dyno=web.1 connect=0ms service=7ms status=500 bytes=404 protocol=https已停产，因此现在视为AmplifyEventBus

相反，使用Legacy，如下所示：

Hub.listen

记录器也可以用相同的方式导入，例如：

<script>
import { Hub } from 'aws-amplify'

export default {
  mounted() {
    Hub.listen('auth', (info) => {
      console.log('auth event:', info)
    })
  },
}
</script>

Gridsome + AWS Amplify-导入事件总线中断注销按钮组件

1 个答案: