用户信息从 { name } 改成 { profile: { name } },发版后老用户打开白屏,控制台报 Cannot read properties of undefined (reading 'name'),回滚后立即恢复。乍看像缓存或者权限的锅,追下去往往不是。

persist(store, {
  name: 'user', version: 2,
  migrate: (s, v) => v < 2 ? { profile: { name: s.name } } : s
});

追下去是这么回事:persist 把旧结构原样从 localStorage 读出来,没有版本号也没有迁移函数,新代码按新路径取值直接拿到 undefined。异常发生在首屏渲染,整页跟着挂掉。

「persist 版本迁移」相关的日志我一般连着看前后五分钟,单看一条报错经常判断不出是哪一步失败。一次只改一处,改完立刻验证,几个改动叠在一起,出问题就说不清是谁导致的。

先做最小复现,能稳定跑出来的问题,排查成本会低一个数量级。别只看报错的最后一行,往上看几行,真正的起因通常在上面。

具体做法是,给 persist 加 version 每次结构变更递增;写 migrate 按旧版本逐级转换 不要只处理最新一版;取深层字段时给默认值兜底;把旧结构数据手动写进 localStorage 再打开验证。

验收就看一点,手动写入 v1 的旧数据后刷新,页面正常渲染且用户名显示正确。

作者 9823189