Vetur: Component mixin methods/members are not recognized by VSCode Intellisense

[lexasss]

• [x] I have searched through existing issues
• [x] I have read through docs
• [x] I have read FAQ

Info

• Platform: Win
• Vetur version: 0.11.7
• VS Code version: 1.19.3

Problem

Component mixin methods/members are not recognized by VSCode Intellisense

fullscreen.js

component.vue

Message shown wthen hovering 'makeFullscreen':

No error messages in Panel -> Output -> Vue Language Server

Reproducible Case

1. create and init a simple Vue project ("vue init webpack mixin-test")

2. create jsconfig.json file in the project root folder:

    {
      "compilerOptions": {
        "alwaysStrict": true,
        "checkJs": true,
        "target": "es2016",
        "module": "es2015",
        "noImplicitAny": true,
        "noImplicitReturns": true,
        "baseUrl": "./", 
        "paths": {
          "@/*" : ["*"],  
          "~/*" : ["*"]    
        }
      },
      "include": [
        "**/*",
        "**/*.vue"
      ]
    }

1. create a mixinTest.vue file in /src/components:

<template>
  <div id="page">
    <button @click="click"> Click me </button>
    <div ref="fullscreen"> Content </div>
  </div>
</template>

<script>
const fullscreen = {
  methods: {
    makeFullscreen(element) {
      // ...
    }
  }
};

export default {
  mixins: [fullscreen],
  methods: {
    click(e) {
      this.makeFullscreen(this.$refs.fullscreen);
    }
  }
};
</script>

1. the method call "makeFullscreen" in the "this.makeFullscreen(this.$refs.fullscreen);" line will be underlined with red.

[HerringtonDarkholme]

It's a known issue.

We cannot support mixin for now in TypeScript, which is the engine underhood.

If you use mixin a lot, you can consider using class style API provided in other libraries.