doc(Vue): fix options API usage

harlan-zw · harlan-zw · commit adada6353be3 · 2025-05-04T18:14:04.000+10:00
Fixes #547
diff --git a/docs/0.vue/head/guides/1.core-concepts/3.options-api.md b/docs/0.vue/head/guides/1.core-concepts/3.options-api.md
@@ -11,18 +11,39 @@ Vue Unhead provides opt-in functionality to the options API, allowing you to def
 
 ## Setup
 
-Import the options API mixin from the `@unhead/vue`{lang="bash"} package and add it to any Vue app entry files.
+To use the options API, you need to install the mixin `VueHeadMixin` with Vue. 
 
-```ts {1,6}
-import { createHead, VueHeadMixin } from '@unhead/vue'
-import { createApp } from 'vue'
+The mixin is exported by both the client and server entry files
+of Unhead, `@unhead/vue/client`{lang="ts"} and `@unhead/vue/server`{lang="ts"} respectively and you'll need
+to install it for both depending on if you server render or not.
 
-const app = createApp()
+::code-group
+
+```ts{2,7} [Client]
+import { createApp } from './main'
+import { createHead, VueHeadMixin } from '@unhead/vue/client'
+
+const { app } = createApp()
 const head = createHead()
+app.use(head)
 app.mixin(VueHeadMixin)
+
+app.mount('#app')
+```
+
+```ts{2,7} [Server]
+import { createApp } from './main'
+import { createHead, VueHeadMixin } from '@unhead/vue/server'
+
+const { app } = createApp()
+const head = createHead()
+app.use(head)
+app.mixin(VueHeadMixin)
+
+app.mount('#app')
 ```
 
-If you're SSR make sure you update the client and server entry files.
+::
 
 ## Usage
 
