Component config object can't be extended with `head` property

AndrewBogdanovTSS commented 6 years ago

Version

v1.2.1

Reproduction link

https://github.com/nuxt-community/nuxt-class-component

Steps to reproduce

Create a component using @Component decorator
Pass head property to a config object

What is expected ?

Title of the related page is changed

What is actually happening?

[tsl] ERROR in ...\nuxt-apollo-github\components\Inspirations.vue.ts(20,3)
      TS2345: Argument of type '{ head: { title: string; }; }' is not assignable to parameter of type 'VueClass<Vu
e>'.
  Object literal may only specify known properties, and 'head' does not exist in type 'VueClass<Vue>'.

Additional comments?

Same is happening with other custom properties. For example, if you try to use @nuxt/apollo module and it's apollo config property you will also get an error:

TS2345: Argument of type '{ apollo: { allInspirations: { prefetch: boolean; query: DocumentNode; }; }; head:
 { title: strin...' is not assignable to parameter of type 'VueClass<Vue>'.
  Object literal may only specify known properties, and 'apollo' does not exist in type 'VueClass<Vue>'.

I think any other custom property will also produce similar error.

_{This bug report is available on Nuxt community (#c9)}

husayt commented 5 years ago

I recommend using "nuxt-property-decorator", which covers all the features of this module and you can see "head" working here

hdsuperman commented 5 years ago

@AndrewBogdanovTSS

Component.registerHooks([
  'beforeRouteEnter',
  'beforeRouteLeave',
  'beforeRouteUpdate', // for vue-router 2.2+
  'head',
]);

nuxt-community / nuxt-class-component