antfu-collective/vite-ssg

[@vueuse useStorage] Lost data in localStorage when I refresh the page? dev normal. after build deploy error.

Opened this issue · 0 comments

Describe the bug

When I login in my home page.
1、authStore.login(data); // checked the data was save in localStorage.
2、When I click refresh button of chrome. I see the "token" in localStorage change to empty string.

When I run "vite --port 3000 --open" in local. the token is ok.
But When I run "vite-ssg build" and deploy to server. the token is missing when I refresh page.

I tried add ssr, but it still doesn't work.

ssr: {
    noExternal: ['@vueuse/core'], // 确保依赖正常工作
  },
import { useStorage } from '@vueuse/core'

export const useAuthStore = defineStore('auth', () => {
  const token = useStorage('token', '');

  const login = (user: any) => {
    const { token: newToken, ...userData } = user
    token.value = newToken
  }

  return {
    token,
    login,
  }
})

Reproduction

test url
1、open it. use chrome dev tools. set localStorage token anything in application.
2、refresh page. the token value is gone.
tips: dev fine. build deploy to server, lost token.
reproduction project.

System Info

npm: 21.1.0
pnpm: 9.11.0

Used Package Manager

pnpm

Validations

  • Follow our Code of Conduct
  • Read the Contributing Guide.
  • Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
  • Check that this is a concrete bug. For Q&A, please open a GitHub Discussion instead.
  • The provided reproduction is a minimal reproducible of the bug.

Contributions

  • I am willing to submit a PR to fix this issue
  • I am willing to submit a PR with failing tests (actually just go ahead and do it, thanks!)