带有 laravel sanctum 的 Nuxt 身份验证引发安装错误答案

【问题标题】：Nuxt auth with laravel sanctum throws mounted error带有 laravel sanctum 的 Nuxt 身份验证引发安装错误
【发布时间】：2020-10-05 20:45:45
【问题描述】：

正如标题所说，我正在尝试使用@nuxtjs/auth 插件进行身份验证。但它不起作用。我已经检查了documentation 并确保我以正确的方式实现了它，而且确实如此。我用谷歌搜索了一个小时，仍然没有得到修复此错误的参考。

请帮我解决这个问题。任何形式的帮助将不胜感激。

nuxt.config.js

...
modules: [
  ...
  '@nuxtjs/axios',
  '@nuxtjs/auth',
  ...
],

axios: {
  proxy: true,
},

proxy: {
  '/api': {
    target: 'https://myapp.nuxtjs.app',
  },
},

auth: {
  strategies: {
    laravelSanctum: {
      provider: 'laravel/sanctum',
      url: process.env.BASE_API_URL || 'http://mylaravelapp.test',
    },
  },
},
...

login.vue

// template script is a apocalyptic,
// lets assume the button and `onSubmit` call works. (it does work)
export default {
  ...
  data() {
    return {
      credentials: {
        email: '',
        password: '',
        remember: false,
      }
    }
  },
  methods: {
    onSubmit() {
      this.$auth
        .loginWith('laravelSanctum', this.credentials)
        .catch((error) => this.onError(error))
    }
    ...
  }
}

error message

client.js?06a0:97 TypeError: Cannot read property 'mounted' of undefined
    at Auth.mounted (auth.js?facc:112)
    at Auth.setStrategy (auth.js?facc:108)
    at Auth.loginWith (auth.js?facc:123)
    at VueComponent.onSubmit (login.vue?ec86:87)
    at submit (login.vue?8c7c:35)
    at invokeWithErrorHandling (vue.runtime.esm.js?2b0e:1854)
    at HTMLFormElement.invoker (vue.runtime.esm.js?2b0e:2179)
    at HTMLFormElement.original._wrapper (vue.runtime.esm.js?2b0e:6917)

【问题讨论】：

这可能是一个路由问题，如此处所述的答案：github.com/fromAtoB/vue-stripe-elements/issues/57
我不认为错误来自路线。提交方法与它无关。
是的，我同意，这与它无关，但我想了解 Mounted 函数。看起来你缺少一些配置
是的..我也知道..还是谢谢。我真的很确定我根据上面链接的文档做的一切都是正确的。我已经检查了 5 次以上，确保没有遗漏任何内容。我猜这可能是插件的错误..
是的，很酷。对不起，我帮不上忙，我看到没有人在这里发帖，所以我试过了，至少，插件可能坏了:(

标签： vue.js nuxt.js

【解决方案1】：

我终于通过卸载@nuxtjs/auth 插件并改用@nuxtjs/auth-next 使其工作。似乎他们没有在文档中提到这一点。该应用程序现在运行良好。

【讨论】：