From: cx33 <lne128gene980@163.com>
Date: Mon, 10 Oct 2022 20:51:04 +0000 (+0800)
Subject: docs(nuxt): pinia plugins usage (#1581) [skip ci]
X-Git-Tag: @pinia/nuxt@0.4.4~24
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=99e2ed5ec53d1427f93d161f7026842b64b38721;p=thirdparty%2Fvuejs%2Fpinia.git

docs(nuxt): pinia plugins usage (#1581) [skip ci]
---

diff --git a/packages/docs/core-concepts/plugins.md b/packages/docs/core-concepts/plugins.md
index bd63afd9..9513eb16 100644
--- a/packages/docs/core-concepts/plugins.md
+++ b/packages/docs/core-concepts/plugins.md
@@ -365,6 +365,29 @@ There is also a `StoreGetters` type to extract the _getters_ from a Store type.
 
 When [using pinia alongside Nuxt](../ssr/nuxt.md), you will have to create a [Nuxt plugin](https://nuxtjs.org/docs/2.x/directory-structure/plugins) first. This will give you access to the `pinia` instance:
 
+```ts
+// plugins/myPiniaPlugin.js
+import { PiniaPluginContext } from 'pinia'
+
+function MyPiniaPlugin({ store }: PiniaPluginContext) {
+  store.$subscribe((mutation) => {
+    // react to store changes
+    console.log(`[🍍 ${mutation.storeId}]: ${mutation.type}.`)
+  })
+
+  // Note this has to be typed if you are using TS
+  return { creationTime: new Date() }
+}
+
+export default defineNuxtPlugin(({ $pinia }) => {
+  $pinia.use(MyPiniaPlugin)
+})
+```
+
+Note the above example is using TypeScript, you have to remove the type annotations `PiniaPluginContext` and `Plugin` as well as their imports if you are using a `.js` file.
+
+### Nuxt.js 2
+
 ```ts
 // plugins/myPiniaPlugin.js
 import { PiniaPluginContext } from 'pinia'
@@ -386,5 +409,3 @@ const myPlugin: Plugin = ({ $pinia }) => {
 
 export default myPlugin
 ```
-
-Note the above example is using TypeScript, you have to remove the type annotations `PiniaPluginContext` and `Plugin` as well as their imports if you are using a `.js` file.