Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Getting Vetur error when using //@ts-check with Nuxt asyncData in Vue Component. #1435

Closed
mrwwalmsley opened this issue Sep 18, 2019 · 2 comments
Labels

Comments

@mrwwalmsley
Copy link

Info

  • Platform: macOS
  • Vetur version:
  • VS Code version: 1.38.0

Problem

I am trying to use Vetur with // @ts-check combined with typescript JSDoc support in JavaScript in my Nuxt project. After playing around with settings in jsconfig.json including adding @nuxt/types, it works great for regular Vue components.

However, when I use asyncData instead of data, Vetur doesn't seem to pick up on the properties that should now be available on this. When I use properties returned by asyncData in computed properties, I get the following error:

Property 'myPropery' does not exist on type 'CombinedVueInstance'

If I add both data and asyncData, then the error goes away:

/**
   * @return {{myProperty: string}}
   */
  data() {
    return {
      myProperty: 'myValue',
    };
  },

/**
   * @return {{myProperty: string}}
   */
  asyncData() {
    return {
      myProperty: 'myValue',
    };
  },

computed: {
    //...mapState('user', ['credits']),

    /**
     * @returns {string}
     */
    test() {
      return this.myProperty;
    }
}

Based on what I've seen, I'm guessing that the Vetur plugin is tracking the properties that were returned by the data method, but not asyncData. Would it be straightforward to add support for asyncData ?

Reproducible Case

Let me know if I need to provide a repo that reproduces this step.
My jsconfig.json contains the following:

{
  "compilerOptions": {
    "target": "esnext",
    "module": "esnext",
    "moduleResolution": "node",
    "lib": ["esnext", "esnext.asynciterable", "dom"],
    "esModuleInterop": true,
    "sourceMap": true,
    "strict": true,
    "noEmit": true,
    "experimentalDecorators": true,
    "resolveJsonModule": true,
    "baseUrl": ".",
    "paths": {
      "~/*": ["./*"],
      "@/*": ["./*"]
    },
    "types": ["@types/node", "@types/jest", "@nuxt/types"]
  }
}
@ktsn
Copy link
Member

ktsn commented Oct 2, 2019

As same reason as #1226, #1355, this should be supported on upstream type declaration and current Vue v2 typings does not support it. We need to wait v3´s composition API.

@ktsn ktsn added the upstream label Oct 2, 2019
@octref
Copy link
Member

octref commented Nov 11, 2019

As said, this isn't possible with v2 typings. If v3 typing allows this it would take a change in Nuxt typings to fix this, not a change in Vetur.

I want to keep only one issue open for it, so follow #1226 please.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

3 participants