{"id":13406123,"url":"https://github.com/vuejs/pinia","last_synced_at":"2025-05-12T16:07:51.519Z","repository":{"id":36960659,"uuid":"222544417","full_name":"vuejs/pinia","owner":"vuejs","description":"🍍 Intuitive, type safe, light and flexible Store for Vue using the composition api with DevTools support","archived":false,"fork":false,"pushed_at":"2025-04-28T19:37:21.000Z","size":9199,"stargazers_count":13837,"open_issues_count":44,"forks_count":1137,"subscribers_count":65,"default_branch":"v3","last_synced_at":"2025-05-05T11:18:41.390Z","etag":null,"topics":["composition-api","ssr","store","vue","vuex"],"latest_commit_sha":null,"homepage":"https://pinia.vuejs.org","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/vuejs.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":".github/CONTRIBUTING.md","funding":".github/funding.yml","license":"LICENSE","code_of_conduct":".github/CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":"SECURITY.md","support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null},"funding":{"github":"posva","custom":"https://www.paypal.me/posva"}},"created_at":"2019-11-18T21:05:01.000Z","updated_at":"2025-05-05T07:44:44.000Z","dependencies_parsed_at":"2023-10-13T12:18:35.489Z","dependency_job_id":"32ab6a57-2486-460d-8fe6-922d1df5b152","html_url":"https://github.com/vuejs/pinia","commit_stats":{"total_commits":1928,"total_committers":256,"mean_commits":7.53125,"dds":0.3044605809128631,"last_synced_commit":"d5dbaee1cc09e31cb66b198791bb84604dd4aa33"},"previous_names":["posva/pinia"],"tags_count":199,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vuejs%2Fpinia","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vuejs%2Fpinia/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vuejs%2Fpinia/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vuejs%2Fpinia/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/vuejs","download_url":"https://codeload.github.com/vuejs/pinia/tar.gz/refs/heads/v3","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":252499813,"owners_count":21758037,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["composition-api","ssr","store","vue","vuex"],"created_at":"2024-07-30T19:02:21.720Z","updated_at":"2025-05-05T12:41:51.881Z","avatar_url":"https://github.com/vuejs.png","language":"TypeScript","funding_links":["https://github.com/sponsors/posva","https://www.paypal.me/posva","https://paypal.me/posva"],"categories":["TypeScript","前端开发框架及项目","vue","Projects Using Vue.js","武器库"],"sub_categories":["其他_文本生成、文本对话","Open Source","前端"],"readme":"\u003cp align=\"center\"\u003e\n  \u003ca href=\"https://pinia.vuejs.org\" target=\"_blank\" rel=\"noopener noreferrer\"\u003e\n    \u003cimg width=\"180\" src=\"https://pinia.vuejs.org/logo.svg\" alt=\"Pinia logo\"\u003e\n  \u003c/a\u003e\n\u003c/p\u003e\n\u003cbr/\u003e\n\u003cp align=\"center\"\u003e\n  \u003ca href=\"https://npmjs.com/package/pinia\"\u003e\u003cimg src=\"https://badgen.net/npm/v/pinia\" alt=\"npm package\"\u003e\u003c/a\u003e\n  \u003ca href=\"https://github.com/vuejs/pinia/actions/workflows/ci.yml\"\u003e\u003cimg src=\"https://github.com/vuejs/pinia/actions/workflows/ci.yml/badge.svg\" alt=\"build status\"\u003e\u003c/a\u003e\n  \u003ca href=\"https://codecov.io/gh/vuejs/pinia\"\u003e\u003cimg src=\"https://codecov.io/gh/vuejs/pinia/graph/badge.svg?token=rU2xxQ6BGH\"/\u003e\u003c/a\u003e\n\u003c/p\u003e\n\u003cbr/\u003e\n\n# Pinia\n\n\u003e Intuitive, type safe and flexible Store for Vue\n\n- 💡 Intuitive\n- 🔑 Type Safe\n- ⚙️ Devtools support\n- 🔌 Extensible\n- 🏗 Modular by design\n- 📦 Extremely light\n- ⛰️ Nuxt Module\n\nThe latest version of pinia works with Vue 3. See the branch [v2](https://github.com/vuejs/pinia/tree/v2) for a version that works with Vue 2.\n\nPinia is the most similar English pronunciation of the word _pineapple_ in Spanish: _piña_. A pineapple is in reality a group of individual flowers that join together to create a multiple fruit. Similar to stores, each one is born individually, but they are all connected at the end. It's also a delicious tropical fruit indigenous to South America.\n\n## 👉 [Demo with Vue 3 on StackBlitz](https://stackblitz.com/github/piniajs/example-vue-3-vite)\n\n## 👉 [Demo with Nuxt 3 on StackBlitz](https://stackblitz.com/github/piniajs/example-nuxt-3)\n\n## Help me keep working on this project 💚\n\n- [Become a Sponsor on GitHub](https://github.com/sponsors/posva)\n- [One-time donation via PayPal](https://paypal.me/posva)\n\n\u003c!--sponsors start--\u003e\n\n\u003ch4 align=\"center\"\u003eGold Sponsors\u003c/h4\u003e\n\u003cp align=\"center\"\u003e\n    \u003ca href=\"https://www.coderabbit.ai/?utm_source=vuerouter\u0026utm_medium=sponsor\" target=\"_blank\" rel=\"noopener noreferrer\"\u003e\n    \u003cpicture\u003e\n      \u003csource srcset=\"https://posva-sponsors.pages.dev/logos/coderabbitai-dark.svg\" media=\"(prefers-color-scheme: dark)\" height=\"72px\" alt=\"CodeRabbit\" /\u003e\n      \u003cimg src=\"https://posva-sponsors.pages.dev/logos/coderabbitai-light.svg\" height=\"72px\" alt=\"CodeRabbit\" /\u003e\n    \u003c/picture\u003e\n  \u003c/a\u003e\n\u003c/p\u003e\n\n\u003ch4 align=\"center\"\u003eSilver Sponsors\u003c/h4\u003e\n\u003cp align=\"center\"\u003e\n    \u003ca href=\"https://www.vuemastery.com/\" target=\"_blank\" rel=\"noopener noreferrer\"\u003e\n    \u003cpicture\u003e\n      \u003csource srcset=\"https://posva-sponsors.pages.dev/logos/vuemastery-dark.png\" media=\"(prefers-color-scheme: dark)\" height=\"42px\" alt=\"VueMastery\" /\u003e\n      \u003cimg src=\"https://posva-sponsors.pages.dev/logos/vuemastery-light.svg\" height=\"42px\" alt=\"VueMastery\" /\u003e\n    \u003c/picture\u003e\n  \u003c/a\u003e\n    \u003ca href=\"https://www.prefect.io/\" target=\"_blank\" rel=\"noopener noreferrer\"\u003e\n    \u003cpicture\u003e\n      \u003csource srcset=\"https://posva-sponsors.pages.dev/logos/prefectlogo-dark.svg\" media=\"(prefers-color-scheme: dark)\" height=\"42px\" alt=\"Prefect\" /\u003e\n      \u003cimg src=\"https://posva-sponsors.pages.dev/logos/prefectlogo-light.svg\" height=\"42px\" alt=\"Prefect\" /\u003e\n    \u003c/picture\u003e\n  \u003c/a\u003e\n    \u003ca href=\"https://route4me.com\" target=\"_blank\" rel=\"noopener noreferrer\"\u003e\n    \u003cpicture\u003e\n      \u003csource srcset=\"https://posva-sponsors.pages.dev/logos/route4me.png\" media=\"(prefers-color-scheme: dark)\" height=\"42px\" alt=\"Route Optimizer and Route Planner Software\" /\u003e\n      \u003cimg src=\"https://posva-sponsors.pages.dev/logos/route4me.png\" height=\"42px\" alt=\"Route Optimizer and Route Planner Software\" /\u003e\n    \u003c/picture\u003e\n  \u003c/a\u003e\n\u003c/p\u003e\n\n\u003ch4 align=\"center\"\u003eBronze Sponsors\u003c/h4\u003e\n\u003cp align=\"center\"\u003e\n    \u003ca href=\"https://storyblok.com\" target=\"_blank\" rel=\"noopener noreferrer\"\u003e\n    \u003cpicture\u003e\n      \u003csource srcset=\"https://posva-sponsors.pages.dev/logos/storyblok.png\" media=\"(prefers-color-scheme: dark)\" height=\"26px\" alt=\"Storyblok\" /\u003e\n      \u003cimg src=\"https://posva-sponsors.pages.dev/logos/storyblok.png\" height=\"26px\" alt=\"Storyblok\" /\u003e\n    \u003c/picture\u003e\n  \u003c/a\u003e\n    \u003ca href=\"https://nuxtlabs.com\" target=\"_blank\" rel=\"noopener noreferrer\"\u003e\n    \u003cpicture\u003e\n      \u003csource srcset=\"https://posva-sponsors.pages.dev/logos/nuxt-dark.svg\" media=\"(prefers-color-scheme: dark)\" height=\"26px\" alt=\"NuxtLabs\" /\u003e\n      \u003cimg src=\"https://posva-sponsors.pages.dev/logos/nuxt-light.svg\" height=\"26px\" alt=\"NuxtLabs\" /\u003e\n    \u003c/picture\u003e\n  \u003c/a\u003e\n    \u003ca href=\"https://stormier.ninja\" target=\"_blank\" rel=\"noopener noreferrer\"\u003e\n    \u003cpicture\u003e\n      \u003csource srcset=\"https://avatars.githubusercontent.com/u/2486424?u=7b0c73ae5d090ce53bf59473094e9606fe082c59\u0026v=4\" media=\"(prefers-color-scheme: dark)\" height=\"26px\" alt=\"Stanislas Ormières\" /\u003e\n      \u003cimg src=\"https://avatars.githubusercontent.com/u/2486424?u=7b0c73ae5d090ce53bf59473094e9606fe082c59\u0026v=4\" height=\"26px\" alt=\"Stanislas Ormières\" /\u003e\n    \u003c/picture\u003e\n  \u003c/a\u003e\n\u003c/p\u003e\n\n\u003c!--sponsors end--\u003e\n\n---\n\n## FAQ\n\nA few notes about the project and possible questions:\n\n**Q**: _Is Pinia the successor of Vuex?_\n\n**A**: [Yes](https://vuejs.org/guide/scaling-up/state-management.html#pinia)\n\n**Q**: _What about dynamic modules?_\n\n**A**: Dynamic modules are not type safe, so instead [we allow creating different stores](https://pinia.vuejs.org/cookbook/composing-stores.html) that can be imported anywhere\n\n## Installation\n\n```bash\n# or pnpm or yarn\nnpm install pinia\n```\n\n## Usage\n\n### Install the plugin\n\nCreate a pinia (the root store) and pass it to app:\n\n```js\n// Vue 3\nimport { createApp } from 'vue'\nimport { createPinia } from 'pinia'\nimport App from './App.vue'\n\nconst pinia = createPinia()\nconst app = createApp(App)\n\napp.use(pinia)\napp.mount('#app')\n```\n\nFor more detailed instructions, including [Nuxt configuration](https://pinia.vuejs.org/ssr/nuxt.html#nuxt-js), check the [Documentation](https://pinia.vuejs.org).\n\n### Create a Store\n\nYou can create as many stores as you want, and they should each exist in different files:\n\n```ts\nimport { defineStore } from 'pinia'\n\n// main is the name of the store. It is unique across your application\n// and will appear in devtools\nexport const useMainStore = defineStore('main', {\n  // a function that returns a fresh state\n  state: () =\u003e ({\n    counter: 0,\n    name: 'Eduardo',\n  }),\n  // optional getters\n  getters: {\n    // getters receive the state as first parameter\n    doubleCounter: (state) =\u003e state.counter * 2,\n    // use getters in other getters\n    doubleCounterPlusOne(): number {\n      return this.doubleCounter + 1\n    },\n  },\n  // optional actions\n  actions: {\n    reset() {\n      // `this` is the store instance\n      this.counter = 0\n    },\n  },\n})\n```\n\n`defineStore` returns a function that has to be called to get access to the store:\n\n```ts\nimport { useMainStore } from '@/stores/main'\nimport { storeToRefs } from 'pinia'\n\nexport default defineComponent({\n  setup() {\n    const main = useMainStore()\n\n    // extract specific store properties\n    const { counter, doubleCounter } = storeToRefs(main)\n\n    return {\n      // gives access to the whole store in the template\n      main,\n      // gives access only to specific state or getter\n      counter,\n      doubleCounter,\n    }\n  },\n})\n```\n\n## Documentation\n\nTo learn more about Pinia, check [its documentation](https://pinia.vuejs.org).\n\n## License\n\n[MIT](http://opensource.org/licenses/MIT)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvuejs%2Fpinia","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fvuejs%2Fpinia","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvuejs%2Fpinia/lists"}