nuxt-class-component and nuxt-property-decorator

[nuxt-community]

nuxt-class-component and nuxt-property-decorator

[qm3ster]

I am very negative about this library duplicating the decorators from https://github.com/kaorun343/vue-property-decorator. At a glance, I don't see it doing anything more than that one.
I see there have recently been PRs merged to this, but they would be of more use at the origin, unless similar have already been deployed there.
Furthermore, like you pointed out, instead of importing nuxt-class-component, it just copies it to the top of the file:

nuxt-property-decorator/src/nuxt-property-decorator.ts

Lines 4 to 18 in 70a3e6d

	import Component, { mixins, createDecorator } from 'vue-class-component';
	Component.registerHooks([
	'beforeRouteEnter',
	'beforeRouteUpdate',
	'beforeRouteLeave',
	'asyncData',
	'fetch',
	'head',
	'middleware',
	'layout',
	'transition',
	'scrollToTop',
	'validate'
	])

Furthermore, due to how registerHooks is implemented, this actually contaminates the normal Component decorator, which some might import directly in non-page components.

I strongly suggest that this module be taken out behind the barn.

I know this will be controversial, as it may increase, visually, the number of inputs in some cases, but I would also vote to neuter nuxt-class-component to the following:

import Component, from 'vue-class-component'

Component.registerHooks([
  'beforeRouteEnter',
  'beforeRouteLeave',
  'asyncData',
  'fetch',
  'head',
  'middleware',
  'layout',
  'transition',
  'scrollToTop',
  'validate'
])

export Component

If someone wants to import all of vuex-class, vue-class-component, vue-property-decorators and nuxt-class-component all the time, they can re-export them themselves, in a single short file inside their project. It's not rocket surgery.

[husayt]

Mihal, also see #27. I touched most of these points there and made a suggestion.

…

On Thu, 6 Dec 2018, 23:00 Mihal Malostanidis ***@***.*** wrote: I am very negative about this library duplicating the decorators from https://github.com/kaorun343/vue-property-decorator. At a glance, I don't see it doing anything more than that one. I see there have recently been PRs merged to this, but they would be of more use at the origin, unless similar have already been deployed there. Furthermore, like you pointed out, instead of importing nuxt-class-component, it just copies it to the top of the file: https://github.com/nuxt-community/nuxt-property-decorator/blob/70a3e6d7dc7be382392841417485482f00930fcb/src/nuxt-property-decorator.ts#L4-L18 Furthermore, due to how registerHooks is implemented, this actually contaminates the normal Component decorator, which some might import directly in non-page components. I strongly suggest that this module be taken out behind the barn. I know this will be controversial, as it may increase, visually, the number of inputs in some cases, but I would also vote to neuter nuxt-class-component to the following: import Component, from 'vue-class-component' Component.registerHooks([ 'beforeRouteEnter', 'beforeRouteLeave', 'asyncData', 'fetch', 'head', 'middleware', 'layout', 'transition', 'scrollToTop', 'validate' ]) export Component If someone wants to import all of vuex-class, vue-class-component, vue-property-decorators and nuxt-class-component all the time, they can re-export them themselves, in a single short file inside their project. It's not rocket surgery. — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub <#25 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/ABHXrC48YKpomQMXPjmnMQbqPvs-jnodks5u2aGIgaJpZM4ZAvGi> .

[qm3ster]

@husayt we can reexport the exports of vuex-class and vue-class-component, directly or from nuxt-class-component, and reexport third-party vue-property-decorators...
Or we can deprecate this module.

[husayt]

Coming back to this chain as over last few months I have resolved some of the issues highlighted here. It is not using nuxt-class-component anymore. It's making it easy to write class based TS/JS components with Nuxt, unlocking all the coolness from vue-class-component , vue-property-decorator and vuex-class and adding nuxt specific hooks and decorators. Also this completely deprecates nuxt-class-component