关于 vue-pinia-best-practices
面向 Vue 开发者和编码 Agent 的 Pinia 最佳实践技能，聚焦 Store、响应性和状态管理中的常见问题，并涉及 SSR、DevTools 与 URL 筛选状态。
主要功能
- 01排查 Pinia 未激活错误
- 02返回 setup store 的全部状态
- 03解构时保持响应性
- 04在模板中绑定 Store 方法
- 05筛选器与大型应用的状态模式
适用场景
- 01修复 Pinia 启动错误
- 02保持解构后的 Store 值响应更新
- 03排查 SSR 或 DevTools 中的 setup store
- 04将可分享的筛选状态保存在 URL
安装
复制下面的命令，在终端中运行。
$
npx skills add https:/安装后在 Claude Code 中输入/vue-pinia-best-practices确认已加载。
包含的文件
除 SKILL.md 外，安装时一起下载的参考资料和脚本。
reference/pinia-no-active-pinia-error.mdpinia-setup-store-return-all-state.mdpinia-store-destructuring-breaks-reactivity.mdstate-url-for-ephemeral-filters.mdstate-use-pinia-for-large-apps.mdstore-method-binding-parentheses.md详细介绍
Pinia 最佳实践、常见问题和状态管理模式。
Store 设置
- 启动时出现 “getActivePinia was called” 错误 → 请参阅 pinia-no-active-pinia-error
- Setup Store 在 DevTools 或 SSR 中缺少状态 → 请参阅 pinia-setup-store-return-all-state
响应性
- 解构 Store 会导致 UI 停止响应式更新 → 请参阅 pinia-store-destructuring-breaks-reactivity
- 在模板调用中，Store 方法会丢失上下文 → 请参阅 store-method-binding-parentheses
状态模式
- 刷新后筛选条件会重置，或无法分享 → 请参阅 state-url-for-ephemeral-filters
- 构建生产应用，但不使用 DevTools 或约定 → 请参阅 state-use-pinia-for-large-apps
评论
支持 Markdown