prazdevs/pinia-plugin-persistedstate

Hydration completed but contains mismatches.

uu-space opened this issue · 0 comments

uu-space commented

Describe the bug

nuxt3 + pinia + pinia-plugin-persistedstate

Nuxt 3.12.2 with Nitro 2.9.6

Setting

persist: {
  storage: persistedState.localStorage,
}

Error info： Hydration completed but contains mismatches.
BFE57BF4FB5FDDBEAF5BAC5CA7076619

Setting ssr:false fixes the problem, but obviously not what I want
Are there any other solutions?

// nuxt.config.ts
export default defineNuxtConfig({
  // ssr: false,
  devtools: { enabled: true },
  modules: [
    "@nuxtjs/tailwindcss",
    "arco-design-nuxt-module",
    "@pinia/nuxt",
    "@pinia-plugin-persistedstate/nuxt",
  ],
  build: {
    transpile: ["pinia-plugin-persistedstate"],
  },
  css: ["~/assets/css/tailwind.css", "~/assets/css/fonts.css"],
});

Reproduction

Example attached

System Info

System:
    OS: Windows 10 10.0.19045
    CPU: (12) x64 12th Gen Intel(R) Core(TM) i5-12400F       
    Memory: 6.91 GB / 15.84 GB
  Binaries:
    Node: 20.11.1 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.22.19 - ~\AppData\Roaming\npm\yarn.CMD
    npm: 10.2.4 - C:\Program Files\nodejs\npm.CMD
    pnpm: 9.1.1 - ~\AppData\Roaming\npm\pnpm.CMD
  Browsers:
    Edge: Spartan (44.19041.3570.0), Chromium (126.0.2592.68)
    Internet Explorer: 11.0.19041.3570

Used Package Manager

npm

Validations