Repository nuxt-class-component

AndrewBogdanovTSS

AndrewBogdanovTSS posted a new bug report

nuxt-class-component • a month ago

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

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.

hartmut-co-uk

hartmut-co-uk posted a new feature request

nuxt-class-component • 3 months ago

idea Adding `watchQuery` & `key` to @Component?

What problem does this feature solve?

Currently when using nuxt with ts - I'm unable to add watchQuery & key to my vue components.

Please see
https://github.com/nuxt/nuxt.js/blob/dev/examples/layout-transitions/pages/users.vue#L22-L25
and/or
https://nuxtjs.org/api/pages-watchquery

Further reference:
https://github.com/nuxt-community/nuxt-property-decorator/issues/13

What does the proposed changes look like?

Adding the fields / ts definitinos?

VlaDi4eKK

VlaDi4eKK posted a new question

nuxt-class-component • 3 months ago

SVG breaks the component and is not correctly inserted into the body

Hello everyone, the project was written on vue half a year ago. Today started to remake his Nuxt. Created a new project started to transfer components from the old project. One of the components uses the svg logo.
But after the project is launched, this logo is inserted in a very strange way. By the method of samples I found that the problem is in svg, but before that it worked fine.
I can not understand what has changed. Perhaps this is a bug or bug?
Агенство создания сайтов Rocket-Biz | Продвижение сайтов | Контекстная реклама 2018-05-07 17-00-01.jpg
rocketbizsite 2018-05-07 17-00-44.png

filosofikode

filosofikode posted a new question

nuxt-class-component • 5 months ago

Dynamic Import?

Any support for dynamic import (in case our module target is to esnext)?

highalps

highalps posted a new question

nuxt-class-component • 6 months ago

[Question] what is difference from vue-class-component?

i'm making own Nuxt project with typescript.
and i got a problem that not triggering asynData methods, but when i
changing library vue-class-component to nuxt-class-compoent, it works.

but… why?
there is no source code related to asyncData (dist/index.js , dist/index.d.ts)

so i wonder that why is it works.


  • I found registerHooks API in lib directory.
    sorry :)
AndrewBogdanovTSS

AndrewBogdanovTSS posted a new question

nuxt-class-component • 6 months ago

Cannot resolve definitions for module nuxt-class-component

I'm using this template inside Webstorm and once I'm trying to import nuxt-class-component into my project I get a reference highlight in red giving me an error: Cannot resolve definitions for module nuxt-class-component although index.d.ts is present in the node_modules/nuxt-class-component/dist/ folder
image
When I try to fix it by importing a related @typed definition package
image
I get another error:
image
I tried to look for a related definition manually but seems like it doesn't exist in the @types repo.
Could someone help me fix this issue?

qm3ster

qm3ster posted a new question

nuxt-class-component • 7 months ago

Purpose of package unclear

What are the goals?
What are the key differences from vue-class-component + vue-property-decorator?

ndarilek

ndarilek posted a new question

nuxt-class-component • 9 months ago

Babel installation instructions and config doesn't match
$ yarn add babel-plugin-syntax-flow babel-plugin-transform-flow-strip-types

Then:

module.exports = {
  build: {
    babel: {
      plugins: ['transform-decorators-legacy', 'transform-class-properties']
    },
...

The configured plugins don't match those installed in the previous step. Which plugins should I use?

Also, the README.md tells me to install the given plugins/config if I'm using Babel. Don't all Nuxt apps use Babel? And shouldn't the installed plugins use --dev?

Thanks.

ndarilek

ndarilek posted a new question

nuxt-class-component • 9 months ago

Can't set middleware

I have the following in layout/default.vue:

<script>
export default {
  middleware: "connected"
}
</script>

connected is a middleware that checks a store state property and redirects if it is null. If I change to:

<script lang="ts">
import Component from "nuxt-class-component"
import Vue from "vue"

@Component({
  middleware: ["connected"]
})
export default class extends Vue {
}

</script>

Am I doing something wrong, or is this a bug in nuxt-class-component? It doesn't seem to matter whether middleware is a string or array.

Thanks.