命名空间模块身份验证的重复命名空间身份验证/

Question

我在安装 nuxtjs 模块后遇到了这个错误。我已经尝试了书中的所有技巧来修复它，但似乎没有任何效果。添加了更多信息。

[vuex] duplicate namespace auth/ for the namespaced module auth

我对此感到沮丧。

auth: {
    plugins: [{ src: '~/plugins/axios', ssr: true }, '~/plugins/auth.js'],
    vuex: {
      namespace: 'auth'
    },
    strategies: {
      local: {
        endpoints: {
          login: {
            url: "login",
            method: "post",
            propertyName: "meta.token"
          },
          user: {
            url: "me",
            method: "get",
            propertyName: false
          },
          logout: {
            url: "logout",
            method: "post"
          },
          redirect: {
            login: "login",
            logout: "/",
            home: "/",
            callback: "/"
          },
          watchLoggedIn: true,
          rewriteRedirects: true
        }
      }
    }
  },

插件

plugins: [
    { src: "~/plugins/Maps.js", ssr: false },
    { src: "~/plugins/Typed.js", ssr: false },
    { src: "~/plugins/Animate.js", ssr: false },
    { src: "~/plugins/Counter.js", ssr: false },
    { src: "~plugins/Vimeo.js", ssr: false },
    "~plugins/mixins/user.js",
    "~plugins/mixins/validation.js",
  ],

auth.js

export const getters = {
    authenticated(state) {
        return state.loggedIn;
    },
    user(state) {
        return state.user;
    }
};

export const state = () => ({
    busy: false,
    loggedIn: false,
    strategy: "local",
    user: false
});

以下是代码，我目前有。如果您需要查看任何其他文件，请随时告诉我。

https://www.youtube.com/watch?v=FojAfwueTLc

Answer 1

更新后今天遇到了同样的问题。解决方法：

将 auth.js 逻辑移至 index.js 并删除 auth.js。

index.js：

export const getters = {
    authenticated(state) {
      return state.auth.loggedIn
    },

    user(state) {
      return state.auth.user
    }
  }

如果你使用的是 user.js mixin，修改如下：

import Vue from 'vue'
import {mapGetters} from 'vuex'

    const User = {
        install(Vue, options) {
            Vue.mixin({
                computed: {
                    ...mapGetters({
                        user: 'user',
                        authenticated: 'authenticated'
                    })
                }
            })
        }
    };

    Vue.use(User);

Answer 2

您的商店文件夹中可能有一个名为“auth.js”的文件，并且您没有在 nuxt.config.js 文件中明确设置 vuex.namespace 选项。

来自文档：

store 目录中的每个 .js 文件都被转换为命名空间模块（索引是根模块）。

也就是说，“auth”自动成为一个命名空间。

问题是“auth”也是用于保持状态的默认 Vuex 存储命名空间，因为如果没有明确设置，则 nuxt.config.js 文件中的“vuex.namespace”选项默认为“auth”。这就是副本的来源。

要解决这个问题，请将 store/auth.js 更改为 store/authentication.js 之类的其他内容，或者将 nuxt.config.js 文件中的 vuex.namespace 选项更改为“auth”以外的其他内容，否则它将是默认使用。

Answer 3

默认情况下，Nuxt 使用 auth namespace 来保留身份验证信息。如果你也在store目录下创建了auth.js文件，那么会和默认配置冲突。

"Panos"提供的解决方案完全没问题。但是，如果您真的有兴趣创建一个新模块来像您一样维护身份验证信息，那么您可以在 store 目录中创建一个文件 Auth.js 而不是 auth.js。不会与默认命名空间冲突。

然后您可以从 nuxt auth 模块返回 auth 信息，如下所示。在这里，我使用rootState 捕获 auth 模块的状态

export const getters = {
authenticated(state, getters, rootState) {
 return rootState.auth.loggedIn;
},

user(state, getters, rootState) {
 return rootState.auth.user;
}
};

另外，如果你使用的是 user.js mixin，修改如下：

import Vue from "vue";
import { mapGetters } from "vuex";

const User = {
  install(Vue, options) {
  Vue.mixin({
  computed: {
    ...mapGetters("Auth", {
      user: "user",
      authenticated: "authenticated"
    })
  }
});
}
};
Vue.use(User);