feat: allow automatic injection of head() into components
#43
Conversation
|
This pull request is being automatically deployed with Vercel (learn more). 🔍 Inspect: https://vercel.com/nuxt-community/composition-api/auv8mou50 |
|
When I use defineComponent in all of my components I have to.Import it directly from @vue/composition-api but I want one import. I think renaming it to something like Head does only Work on components in the Page folder. |
I think This is a drop-in replacement for Do you have a view from DX perspective @chanlito? |
src/component.ts
Outdated
| ): ReturnType<typeof define> | ||
|
|
||
| export function defineComponent(options: any) { | ||
| const reactiveHead = reactive<MetaInfo>({}) |
| @@ -0,0 +1 @@ | |||
| declare module 'defu' | |||
There was a problem hiding this comment.
This will need to go. defu has types but for some reason rollup wasn't recognising them until I edited its package.json.
src/component.ts
Outdated
| if (!vm) throw new Error('useMeta must be called within a component.') | ||
|
|
||
| const { head } = vm.$options | ||
| if (!head || !(head instanceof Function)) |
There was a problem hiding this comment.
Does vm.$options has head property if I set one in my nuxt.config.js ?
There was a problem hiding this comment.
No, it is per-component.
|
We can add a value to the Option so we can check if your defineComponent was used |
This improves the
useMeta()helper by removing the need to passheadintodefineComponent. Instead, a helper function is injected into components that can then be hooked into byuseMeta.BREAKING CHANGE:
useHead()no longer exists and insteaduseMetacan be used directly withinsetup, as long as a minimalhead: {}is defined in the component options.Note: Work has already begun on composable hooks for
vue-metathat will mean we don't even need to define a minimalheadobject: see here.TODO:
useMetacloses #41