docs: note about custom properties in devtools

diff --git a/docs/core-concepts/plugins.md b/docs/core-concepts/plugins.md
index 9a0676cff8cc5c44bb8e9109f0580c9d2df3585e..3d4776a100d15aedee6cbb5883f860e770f98a4e 100644 (file)
--- a/docs/core-concepts/plugins.md
+++ b/docs/core-concepts/plugins.md
@@ -53,7 +53,7 @@ You can add properties to every store by simply returning an object of them in a
 pinia.use(() => ({ hello: 'world' }))
 ```
 
-You can also set the property directly on the `store`:
+You can also set the property directly on the `store` but **if possible use the return version so they can be automatically tracked by devtools**:
 
 ```js
 pinia.use(({ store }) => {
@@ -108,6 +108,17 @@ pinia.use(({ store }) => {
 })
 ```
 
+Any property _returned_ by a plugin will be automatically tracked by devtools so in order to make `hasError` visible in devtools, make sure to add it to `store._customProperties` **in dev mode only** if you want to debug it in devtools:
+
+```js
+// from the example above
+pinia.use(({ store }) => {
+  store.$state.secret = globalSecret
+  store.secret = globalSecret
+  store._customProperties.add('secret')
+})
+```
+
 :::warning
 If you are using **Vue 2**, Pinia is subject to the [same reactivity caveats](https://vuejs.org/v2/guide/reactivity.html#Change-Detection-Caveats) as Vue. You will need to use `set` from `@vue/composition-api`: