Pinpointing if this is a bug, and if so where...

[dsl101]

I'm not entirely confident of the architecture of my setup, but I have SublimeText 4, with LSP-vue (3.5.0), LSP-eslint (2.1.0), and LSP-typescript (2.13.2). For the most part, everything is working nicely. And then I noticed an issue in a legacy project, and spent a good deal of time trying to work out what broke. Then I checked it out in our most recent project, which is running the latest version of all the frameworks, libraries, etc and see the same thing. And full disclosure, it was Claude that eventually suggested that, given where I got to, this was a bug with the language server. It may not be—hence asking for more help here.

The issue is visible in this simple sfc:

<template>
  <button @click="handleClick" />
</template>

<script setup>
  const props = defineProps({
    meaning: {
      type: Number,
      default: 42,
    },
  })
</script>

If I go to the script block and type function h, I get the completion handleClick show up immediately, and all is well. However, if I change the props definition to a bare call:

<template>
  <button @click="handleClick" />
</template>

<script setup>
  defineProps({
    meaning: {
      type: Number,
      default: 42,
    },
  })
</script>

The completion no longer shows up at all. In both cases, I see warnings in the template section that handleClick is undefined, so the server is clearly picking that up, but it doesn't offer it as a completion in the second case.

Is this a misconfiguration on my part? Or is it actually something not working as it should?

[Muhammed-Kara]

This looks like a language-server completion bug (or possibly a client-specific integration issue), rather than a Vue configuration problem.

Both forms of defineProps() are valid. Assigning its return value only creates a local props binding for use inside <script setup>; it should not affect completion for an unrelated missing template symbol such as handleClick. The fact that both versions correctly report handleClick as undefined also shows that template analysis is active in both cases.

A useful way to narrow down where the issue lives would be to run the same minimal SFC with the Vue - Official extension in VS Code:

• If completion also disappears there, this is likely a vue-language-tools completion bug.
• If VS Code suggests handleClick but Sublime does not, the difference is likely in LSP-vue/Sublime’s handling of completion items or completion edits.

As a temporary workaround, keeping an otherwise-unused binding works:

const _props = defineProps({
  meaning: {
    type: Number,
    default: 42,
  },
})

For a bug report, I would include this minimal SFC, the vue-language-server version, the TypeScript version, whether VS Code reproduces it, and the completion request/response from the LSP log.

[dsl101]

Thanks—I don't have or use VS Code at the moment. If anyone can help check that, I'm happy to keep pushing / raise a ticket in the right place.