Pinia Colada Skilld

This covers Pinia Colada, Vue's smart data fetching layer that handles query caching, background refreshes, and optimistic updates without the boilerplate. You'll want it anytime you're working with async data in Vue, especially if you're tired of manually coordinating loading states across components. The big thing to know: it splits status into two refs (data state and async operation state), which can trip you up initially but makes sense once you're handling concurrent requests. The skill includes breaking changes across versions, so it's handy for debugging type errors or understanding why `isFetching` became `isLoading`. Use `defineQuery()` for shared state and lean on `refresh()` over `refetch()` unless you specifically need to bypass the cache.

Install to Claude Code

npx -y skills add harlan-zw/vue-ecosystem-skills --skill pinia-colada-skilld --agent claude-code