Merge branch 'v2' into v2

vuejs · Nov 28, 2024 · 6e90129 · 6e90129
2 parents db6e0c5 + 1064c3e
commit 6e90129
Show file tree

Hide file tree

Showing 44 changed files with 2,894 additions and 2,712 deletions.
diff --git a/.github/ISSUE_TEMPLATE/config.yml b/.github/ISSUE_TEMPLATE/config.yml
@@ -3,6 +3,9 @@ contact_links:
   - name: Question
     url: https://github.com/vuejs/pinia/discussions/new?category=Q-A
     about: Ask a question or discuss about Pinia
+  - name: Paid consultation
+    url: https://cal.com/posva/consultancy
+    about: Get direct help from the author of Pinia with your project
   - name: Ideas
     url: https://github.com/vuejs/pinia/discussions/new?category=Ideas
     about: Start a discussion to improve Pinia

diff --git a/.gitignore b/.gitignore
@@ -17,3 +17,4 @@ packages/docs/api
 yalc.lock
 .idea
 .vitepress/cache
+tsconfig.vitest-temp.json
diff --git a/.prettierrc.js b/.prettierrc.js
@@ -1,4 +1,4 @@
-module.exports = {
+export default {
   semi: false,
   trailingComma: 'es5',
   singleQuote: true,

diff --git a/package.json b/package.json
@@ -1,6 +1,7 @@
 {
   "name": "@pinia/root",
-  "packageManager": "[email protected]",
+  "packageManager": "[email protected]",
+  "type": "module",
   "private": true,
   "workspaces": [
     "packages/*"
@@ -28,24 +29,24 @@
     "postinstall": "simple-git-hooks"
   },
   "devDependencies": {
+    "@posva/prompts": "^2.4.4",
     "@rollup/plugin-alias": "^5.1.0",
-    "@rollup/plugin-commonjs": "^26.0.1",
+    "@rollup/plugin-commonjs": "^28.0.1",
     "@rollup/plugin-node-resolve": "^15.2.3",
-    "@rollup/plugin-replace": "^5.0.7",
+    "@rollup/plugin-replace": "^6.0.1",
     "@rollup/plugin-terser": "^0.4.4",
     "@types/lodash.kebabcase": "^4.1.9",
     "@types/node": "^20.14.12",
-    "@vitest/coverage-v8": "^2.1.1",
-    "@vitest/ui": "^2.1.1",
-    "@vue/compiler-sfc": "~3.5.10",
-    "@vue/server-renderer": "~3.5.10",
+    "@vitest/coverage-v8": "^2.1.5",
+    "@vitest/ui": "^2.1.5",
+    "@vue/compiler-sfc": "~3.5.13",
+    "@vue/server-renderer": "~3.5.13",
     "chalk": "^5.3.0",
     "conventional-changelog-cli": "^2.2.2",
-    "enquirer": "^2.4.1",
-    "execa": "^9.3.0",
+    "execa": "^9.5.1",
     "globby": "^14.0.1",
-    "happy-dom": "^15.7.4",
-    "lint-staged": "^15.2.7",
+    "happy-dom": "^15.11.6",
+    "lint-staged": "^15.2.10",
     "lodash.kebabcase": "^4.1.1",
     "minimist": "^1.2.8",
     "p-series": "^3.0.0",
@@ -56,11 +57,11 @@
     "rollup-plugin-typescript2": "^0.36.0",
     "semver": "^7.6.3",
     "simple-git-hooks": "^2.11.1",
-    "typedoc": "^0.26.7",
-    "typedoc-plugin-markdown": "^4.2.8",
-    "typescript": "~5.6.2",
-    "vitest": "^2.1.1",
-    "vue": "~3.5.10"
+    "typedoc": "^0.26.11",
+    "typedoc-plugin-markdown": "^4.2.10",
+    "typescript": "~5.6.3",
+    "vitest": "^2.1.5",
+    "vue": "~3.5.13"
   },
   "simple-git-hooks": {
     "pre-commit": "pnpm lint-staged",

diff --git a/packages/docs/.vitepress/config/shared.ts b/packages/docs/.vitepress/config/shared.ts
@@ -96,7 +96,7 @@ export const sharedConfig = defineConfig({
     [
       'script',
       {
-        src: 'https://vueschool.io/banner.js?affiliate=vuerouter&type=top',
+        src: 'https://vueschool.io/banner.js?affiliate=pinia&type=top',
         // @ts-expect-error: vitepress bug
         async: true,
         type: 'text/javascript',

diff --git a/packages/docs/api/pinia/index.md b/packages/docs/api/pinia/index.md
@@ -92,5 +92,6 @@ editLink: false
 - [mapWritableState](functions/mapWritableState.md)
 - [setActivePinia](functions/setActivePinia.md)
 - [setMapStoreSuffix](functions/setMapStoreSuffix.md)
+- [shouldHydrate](functions/shouldHydrate.md)
 - [skipHydrate](functions/skipHydrate.md)
 - [storeToRefs](functions/storeToRefs.md)
diff --git a/packages/docs/api/pinia/interfaces/DefineStoreOptions.md b/packages/docs/api/pinia/interfaces/DefineStoreOptions.md
@@ -35,15 +35,15 @@ augment stores with the plugin API.
 
 ### actions?
 
-> `optional` **actions**: `A` & `ThisType`\<`A` & `UnwrapRef`\<`S`\> & [`_StoreWithState`](StoreWithState.md)\<`Id`, `S`, `G`, `A`\> & [`_StoreWithGetters`](../type-aliases/StoreWithGetters.md)\<`G`\> & [`PiniaCustomProperties`](PiniaCustomProperties.md)\<`string`, [`StateTree`](../type-aliases/StateTree.md), [`_GettersTree`](../type-aliases/GettersTree.md)\<[`StateTree`](../type-aliases/StateTree.md)\>, [`_ActionsTree`](../type-aliases/ActionsTree.md)\>\>
+> `optional` **actions**: `A` & `ThisType`\<`A` & `UnwrapRef`\<`S`\> & [`_StoreWithState`](StoreWithState.md)\<`Id`, `S`, `G`, `A`\> & `_StoreWithGetters_Readonly`\<`G`\> & `_StoreWithGetters_Writable`\<`G`\> & [`PiniaCustomProperties`](PiniaCustomProperties.md)\<`string`, [`StateTree`](../type-aliases/StateTree.md), [`_GettersTree`](../type-aliases/GettersTree.md)\<[`StateTree`](../type-aliases/StateTree.md)\>, [`_ActionsTree`](../type-aliases/ActionsTree.md)\>\>
 
 Optional object of actions.
 
 ***
 
 ### getters?
 
-> `optional` **getters**: `G` & `ThisType`\<`UnwrapRef`\<`S`\> & [`_StoreWithGetters`](../type-aliases/StoreWithGetters.md)\<`G`\> & [`PiniaCustomProperties`](PiniaCustomProperties.md)\<`string`, [`StateTree`](../type-aliases/StateTree.md), [`_GettersTree`](../type-aliases/GettersTree.md)\<[`StateTree`](../type-aliases/StateTree.md)\>, [`_ActionsTree`](../type-aliases/ActionsTree.md)\>\> & [`_GettersTree`](../type-aliases/GettersTree.md)\<`S`\>
+> `optional` **getters**: `G` & `ThisType`\<`UnwrapRef`\<`S`\> & `_StoreWithGetters_Readonly`\<`G`\> & `_StoreWithGetters_Writable`\<`G`\> & [`PiniaCustomProperties`](PiniaCustomProperties.md)\<`string`, [`StateTree`](../type-aliases/StateTree.md), [`_GettersTree`](../type-aliases/GettersTree.md)\<[`StateTree`](../type-aliases/StateTree.md)\>, [`_ActionsTree`](../type-aliases/ActionsTree.md)\>\> & [`_GettersTree`](../type-aliases/GettersTree.md)\<`S`\>
 
 Optional object of getters.
 

diff --git a/packages/docs/api/pinia/interfaces/DefineStoreOptionsInPlugin.md b/packages/docs/api/pinia/interfaces/DefineStoreOptionsInPlugin.md
@@ -40,7 +40,7 @@ Defaults to an empty object if no actions are defined.
 
 ### getters?
 
-> `optional` **getters**: `G` & `ThisType`\<`UnwrapRef`\<`S`\> & [`_StoreWithGetters`](../type-aliases/StoreWithGetters.md)\<`G`\> & [`PiniaCustomProperties`](PiniaCustomProperties.md)\<`string`, [`StateTree`](../type-aliases/StateTree.md), [`_GettersTree`](../type-aliases/GettersTree.md)\<[`StateTree`](../type-aliases/StateTree.md)\>, [`_ActionsTree`](../type-aliases/ActionsTree.md)\>\> & [`_GettersTree`](../type-aliases/GettersTree.md)\<`S`\>
+> `optional` **getters**: `G` & `ThisType`\<`UnwrapRef`\<`S`\> & `_StoreWithGetters_Readonly`\<`G`\> & `_StoreWithGetters_Writable`\<`G`\> & [`PiniaCustomProperties`](PiniaCustomProperties.md)\<`string`, [`StateTree`](../type-aliases/StateTree.md), [`_GettersTree`](../type-aliases/GettersTree.md)\<[`StateTree`](../type-aliases/StateTree.md)\>, [`_ActionsTree`](../type-aliases/ActionsTree.md)\>\> & [`_GettersTree`](../type-aliases/GettersTree.md)\<`S`\>
 
 Optional object of getters.
 

diff --git a/packages/docs/api/pinia/type-aliases/ExtractActionsFromSetupStore.md b/packages/docs/api/pinia/type-aliases/ExtractActionsFromSetupStore.md
@@ -10,7 +10,7 @@ editLink: false
 
 # Type Alias: \_ExtractActionsFromSetupStore\<SS\>
 
-> **\_ExtractActionsFromSetupStore**\<`SS`\>: `SS` *extends* `undefined` \| `void` ? `object` : [`_ExtractActionsFromSetupStore_Keys`](ExtractActionsFromSetupStore_Keys.md)\<`SS`\> *extends* keyof `SS` ? `Pick`\<`SS`, [`_ExtractActionsFromSetupStore_Keys`](ExtractActionsFromSetupStore_Keys.md)\<`SS`\>\> : `never`
+> **\_ExtractActionsFromSetupStore**\<`SS`\>: `SS` *extends* `undefined` \| `void` ? `object` : `Pick`\<`SS`, [`_ExtractActionsFromSetupStore_Keys`](ExtractActionsFromSetupStore_Keys.md)\<`SS`\>\>
 
 For internal use **only**
 

diff --git a/packages/docs/api/pinia/type-aliases/ExtractGettersFromSetupStore.md b/packages/docs/api/pinia/type-aliases/ExtractGettersFromSetupStore.md
@@ -10,7 +10,7 @@ editLink: false
 
 # Type Alias: \_ExtractGettersFromSetupStore\<SS\>
 
-> **\_ExtractGettersFromSetupStore**\<`SS`\>: `SS` *extends* `undefined` \| `void` ? `object` : [`_ExtractGettersFromSetupStore_Keys`](ExtractGettersFromSetupStore_Keys.md)\<`SS`\> *extends* keyof `SS` ? `Pick`\<`SS`, [`_ExtractGettersFromSetupStore_Keys`](ExtractGettersFromSetupStore_Keys.md)\<`SS`\>\> : `never`
+> **\_ExtractGettersFromSetupStore**\<`SS`\>: `SS` *extends* `undefined` \| `void` ? `object` : `Pick`\<`SS`, [`_ExtractGettersFromSetupStore_Keys`](ExtractGettersFromSetupStore_Keys.md)\<`SS`\>\>
 
 For internal use **only**
 

diff --git a/packages/docs/api/pinia/type-aliases/StoreWithGetters.md b/packages/docs/api/pinia/type-aliases/StoreWithGetters.md
@@ -10,7 +10,7 @@ editLink: false
 
 # Type Alias: \_StoreWithGetters\<G\>
 
-> **\_StoreWithGetters**\<`G`\>: `{ readonly [k in keyof G]: G[k] extends Function ? R : UnwrapRef<G[k]> }`
+> **\_StoreWithGetters**\<`G`\>: `_StoreWithGetters_Readonly`\<`G`\> & `_StoreWithGetters_Writable`\<`G`\>
 
 Store augmented with getters. For internal usage only.
 For internal use **only**

diff --git a/packages/docs/cookbook/testing.md b/packages/docs/cookbook/testing.md
@@ -168,7 +168,7 @@ expect(store.someAction).toHaveBeenCalledTimes(1)
 
 ### Mocking the returned value of an action
 
-Actions are automatically spied but type-wise, they are still the regular actions. In order to get the correct type, we must implement a custom type-wrapper that is applies the `Mock` type to each action. **This type depends on the testing framework you are using**. Here is an example with Vitest:
+Actions are automatically spied but type-wise, they are still the regular actions. In order to get the correct type, we must implement a custom type-wrapper that applies the `Mock` type to each action. **This type depends on the testing framework you are using**. Here is an example with Vitest:
 
 ```ts
 import type { Mock } from 'vitest'

diff --git a/packages/docs/core-concepts/plugins.md b/packages/docs/core-concepts/plugins.md
@@ -112,7 +112,7 @@ This is why you can access all computed properties without `.value` and why they
 If you want to add new state properties to a store or properties that are meant to be used during hydration, **you will have to add it in two places**:
 
 - On the `store` so you can access it with `store.myState`
-- On `store.$state` so it can be used in devtools and, **be serialized during SSR**.
+- On `store.$state` so it can be used in devtools and **be serialized during SSR**.
 
 On top of that, you will certainly have to use a `ref()` (or other reactive API) in order to share the value across different accesses:
 
@@ -209,7 +209,7 @@ pinia.use(({ store }) => {
 
 ## Calling `$subscribe` inside plugins
 
-You can use [store.$subscribe](./state.md#subscribing-to-the-state) and [store.$onAction](./actions.md#subscribing-to-actions) inside plugins too:
+You can use [store.$subscribe](./state.md#Subscribing-to-the-state) and [store.$onAction](./actions.md#Subscribing-to-actions) inside plugins too:
 
 ```ts
 pinia.use(({ store }) => {

diff --git a/packages/docs/core-concepts/state.md b/packages/docs/core-concepts/state.md
@@ -252,6 +252,19 @@ cartStore.$subscribe((mutation, state) => {
 })
 ```
 
+### Flush timing
+
+Under the hood, `$subscribe()` uses Vue's `watch()` function. You can pass the same options as you would with `watch()`. This is useful when you want to immediately trigger subscriptions after **each** state change:
+
+```ts{4}
+cartStore.$subscribe((state) => {
+  // persist the whole state to the local storage whenever it changes
+  localStorage.setItem('cart', JSON.stringify(state))
+}, { flush: 'sync' })
+```
+
+### Detaching subscriptions
+
 By default, _state subscriptions_ are bound to the component where they are added (if the store is inside a component's `setup()`). Meaning, they will be automatically removed when the component is unmounted. If you also want to keep them after the component is unmounted, pass `{ detached: true }` as the second argument to _detach_ the _state subscription_ from the current component:
 
 ```vue

diff --git a/packages/docs/introduction.md b/packages/docs/introduction.md
@@ -24,9 +24,9 @@ Pinia is a store library for Vue, it allows you to share a state across componen
 - Testing utilities
 - Plugins: extend Pinia features with plugins
 - Proper TypeScript support or **autocompletion** for JS users
-- Server Side Rendering Support
+- Server Side Rendering support
 - Devtools support
-  - A timeline to track actions, mutations
+  - A timeline to track actions and mutations
   - Stores appear in components where they are used
   - Time travel and easier debugging
 - Hot module replacement

diff --git a/packages/docs/package.json b/packages/docs/package.json
@@ -14,9 +14,9 @@
   },
   "dependencies": {
     "@chenfengyuan/vue-countdown": "^2.1.2",
-    "@vueuse/core": "^10.11.0",
+    "@vueuse/core": "^11.2.0",
     "pinia": "workspace:*",
-    "vitepress": "1.3.4",
+    "vitepress": "1.5.0",
     "vitepress-translation-helper": "^0.2.1",
     "vue-use-spring": "^0.3.3"
   }

diff --git a/packages/docs/ssr/index.md b/packages/docs/ssr/index.md
@@ -63,10 +63,10 @@ onServerPrefetch(async () => {
 
 ## State hydration
 
-To hydrate the initial state, you need to make sure the rootState is included somewhere in the HTML for Pinia to pick it up later on. Depending on what you are using for SSR, **you should escape the state for security reasons**. We recommend using [@nuxt/devalue](https://github.com/nuxt-contrib/devalue) which is the one used by Nuxt.js:
+To hydrate the initial state, you need to make sure the rootState is included somewhere in the HTML for Pinia to pick it up later on. Depending on what you are using for SSR, **you should escape the state for security reasons**. We recommend using [devalue](https://github.com/Rich-Harris/devalue) which is the one used by Nuxt.js:
 
 ```js
-import devalue from '@nuxt/devalue'
+import devalue from 'devalue'
 import { createPinia } from 'pinia'
 // retrieve the rootState server side
 const pinia = createPinia()
@@ -83,7 +83,7 @@ app.use(pinia)
 devalue(pinia.state.value)
 ```
 
-Depending on what you are using for SSR, you will set an _initial state_ variable that will be serialized in the HTML. You should also protect yourself from XSS attacks. You can use [other alternatives](https://github.com/nuxt-contrib/devalue#see-also) to `@nuxt/devalue` depending on what you need, e.g. if you can serialize and parse your state with `JSON.stringify()`/`JSON.parse()`, **you could improve your performance by a lot**.
+Depending on what you are using for SSR, you will set an _initial state_ variable that will be serialized in the HTML. You should also protect yourself from XSS attacks. You can use [other alternatives](https://github.com/Rich-Harris/devalue#see-also) to `devalue` depending on what you need, e.g. if you can serialize and parse your state with `JSON.stringify()`/`JSON.parse()`, **you could improve your performance by a lot**.
 
 If you are not using Nuxt you will need to handle the serialization and hydration of the state yourself. Here are some examples:
 

diff --git a/packages/docs/ssr/nuxt.md b/packages/docs/ssr/nuxt.md
@@ -13,6 +13,8 @@ Using Pinia with [Nuxt](https://nuxt.com/) is easier since Nuxt takes care of a
 npx nuxi@latest module add pinia
 ```
 
+This will add both `@pinia/nuxt` and `pinia` to your project. **If you notice that `pinia` is not installed, please install it manually** with your package manager: `npm i pinia`.
+
 :::tip
 If you're using npm, you might encounter an _ERESOLVE unable to resolve dependency tree_ error. In that case, add the following to your `package.json`:
 
@@ -62,18 +64,18 @@ await useAsyncData('user', () => store.fetchUser().then(() => true))
 
 ::: tip
 
-If you want to use a store outside of `setup()`, remember to pass the `pinia` object to `useStore()`. We added it to [the context](https://nuxtjs.org/docs/2.x/internals-glossary/context) so you have access to it in `asyncData()` and `fetch()`:
+If you want to use a store outside of `setup()` or an _injection aware_ context (e.g. Navigation guards, other stores, Nuxt Middlewares, etc), remember to pass the `pinia` instance to `useStore()`, for the reasons alluded to [here](https://pinia.vuejs.org/core-concepts/outside-component-usage.html#SSR-Apps). Retrieving the `pinia` instance might vary.
 
-```js
+```ts
 import { useStore } from '~/stores/myStore'
 
-export default {
-  asyncData({ $pinia }) {
-    const store = useStore($pinia)
-  },
-}
+// this line is usually inside a function that is able to retrieve
+// the pinia instance
+const store = useStore(pinia)
 ```
 
+Fortunately, most of the time you **don't need to go through this hassle**.
+
 :::
 
 ## Auto imports

diff --git a/packages/docs/zh/cookbook/testing.md b/packages/docs/zh/cookbook/testing.md
@@ -175,7 +175,7 @@ expect(store.someAction).toHaveBeenCalledTimes(1)
 
 ### Mocking the returned value of an action
 
-Actions are automatically spied but type-wise, they are still the regular actions. In order to get the correct type, we must implement a custom type-wrapper that is applies the `Mock` type to each action. **This type depends on the testing framework you are using**. Here is an example with Vitest:
+Actions are automatically spied but type-wise, they are still the regular actions. In order to get the correct type, we must implement a custom type-wrapper that applies the `Mock` type to each action. **This type depends on the testing framework you are using**. Here is an example with Vitest:
 
 ```ts
 import type { Mock } from 'vitest'

diff --git a/packages/nuxt/CHANGELOG.md b/packages/nuxt/CHANGELOG.md
@@ -1,3 +1,42 @@
+## [0.8.0](https://github.com/vuejs/pinia/compare/@pinia/[email protected]...@pinia/[email protected]) (2024-11-28)
+
+This release partially fixes a bug in production of:
+
+> vueDemi2.effectScope is not a function
+
+The remaining part in in [nypm](https://github.com/unjs/nypm/pull/165). In the meantime, you will have to manually add `pinia` with your favorite package manager:
+
+```sh
+pnpm i pinia
+```
+
+### Bug Fixes
+
+- allow module to install pinia alongside ([#2846](https://github.com/vuejs/pinia/issues/2846)) ([3e8ed69](https://github.com/vuejs/pinia/commit/3e8ed69addc30954b887241faed8778048e5d20e))
+
+# [0.7.0](https://github.com/vuejs/pinia/compare/@pinia/[email protected]...@pinia/[email protected]) (2024-11-03)
+
+### Bug Fixes
+
+- dedupe pinia ([#2821](https://github.com/vuejs/pinia/issues/2821)) ([90d8eb9](https://github.com/vuejs/pinia/commit/90d8eb900071964388c54d579ffc84c8ef01c191))
+
+## [0.6.1](https://github.com/vuejs/pinia/compare/@pinia/[email protected]...@pinia/[email protected]) (2024-10-31)
+
+### Bug Fixes
+
+- upgrade minimum version for nuxt kit ([3dab0a6](https://github.com/vuejs/pinia/commit/3dab0a6a43f00d7a52d62d53748c7d5e0cb061ea)), closes [#2814](https://github.com/vuejs/pinia/issues/2814)
+
+# [0.6.0](https://github.com/vuejs/pinia/compare/@pinia/[email protected]...@pinia/[email protected]) (2024-10-29)
+
+### Bug Fixes
+
+- avoid broken alias ([65031ee](https://github.com/vuejs/pinia/commit/65031ee77ed46a34bc2359223e24c7944e840819))
+- **nuxt:** ensure payload plugin declaration is generated ([#2806](https://github.com/vuejs/pinia/issues/2806)) ([99ab76c](https://github.com/vuejs/pinia/commit/99ab76c685405a93f7fc41b335fe5710e9b7fee8))
+
+### Features
+
+- **nuxt:** do not serialize skipHydrate properties ([e645fc1](https://github.com/vuejs/pinia/commit/e645fc12ea115a2d2cc395ad83e4cc3df350c4ea))
+
 ## [0.5.5](https://github.com/vuejs/pinia/compare/@pinia/[email protected]...@pinia/[email protected]) (2024-09-30)
 
 No changes in this release

diff --git a/packages/nuxt/__tests__/nuxt.spec.ts b/packages/nuxt/__tests__/nuxt.spec.ts