Nuxt.js项目中vuex-persistedstate的SSR禁用失效，报window未定义错误

你的问题根源在于错误的Store配置方式：直接在插件文件中创建Vuex Store实例，即使设置了ssr: false，服务端渲染阶段依然会执行到createPersistedState()的初始化代码，从而触发window访问报错。以下是正确的修复步骤：

1. 改用Nuxt官方推荐的Store结构 #

删除原有的persistedState.js，在项目根目录创建store文件夹，并新建store/index.js文件，按以下方式编写：

// store/index.js
import createPersistedState from 'vuex-persistedstate'

// 定义状态
export const state = () => ({
  token: null
})

// 定义getters
export const getters = {
  isAuthenticated: state => state.token !== null
}

// 定义mutations
export const mutations = {
  setToken(state, token) {
    state.token = token
  }
}

// 初始化插件数组
export const plugins = []

// 仅在客户端环境注册persistedState插件
if (process.client) {
  plugins.push(createPersistedState({
    key: 'nuxt-auth-token', // 自定义存储的key，避免冲突
    paths: ['token'] // 仅持久化token字段，按需配置
  }))
}

2. 清理nuxt.config.js中的无效配置 #

移除plugins数组里的{ src: "@/plugins/persistedState.js", ssr: false }，因为Nuxt会自动加载store目录下的文件，无需手动注册为插件。

3. 中间件中正确调用Store #

在中间件里通过context.store访问状态即可，示例：

// middleware/auth.js
export default function ({ store, redirect }) {
  if (!store.getters.isAuthenticated) {
    return redirect('/login')
  }
}

为什么原写法无效？ #

原代码直接在插件文件中创建Store实例，即使标记了ssr: false，Nuxt在服务端初始化时仍会加载该文件并执行createPersistedState()，此时服务端环境没有window对象，自然触发报错。而通过process.client判断，能确保插件仅在客户端注册，彻底规避服务端执行风险。

内容的提问来源于stack exchange，提问作者Guiflayrom_gda