Vue + Astro extension conflict: no auto-import suggestions in Vue template prop expressions

[apvd79]

Vue - Official extension or vue-tsc version

3.2.5

VSCode version

1.111.0

Vue version

3.5.30

TypeScript version

n/a

System Info

System:
  OS: macOS 26.3.1
  CPU: (10) arm64 Apple M2 Pro
  Memory: 114.73 MB / 16.00 GB
  Shell: 5.9 - /bin/zsh
Binaries:
  Node: 25.8.0 - /opt/homebrew/bin/node
  npm: 11.11.0 - /opt/homebrew/bin/npm
  pnpm: 10.31.0 - /opt/homebrew/bin/pnpm
Browsers:
  Brave Browser: 146.1.88.127
  Chrome: 145.0.7632.160
  Firefox: 148.0
  Safari: 26.3.1

package.json dependencies

{
  "name": "volar-astro-repro",
  "private": true,
  "version": "0.0.0",
  "type": "module",
  "scripts": {
    "dev": "vite"
  },
  "dependencies": {
    "@fortawesome/fontawesome-svg-core": "^6.7.0",
    "@fortawesome/free-solid-svg-icons": "^6.7.0",
    "@fortawesome/vue-fontawesome": "^3.0.8",
    "vue": "^3.5.0"
  },
  "devDependencies": {
    "@vitejs/plugin-vue": "^5.2.0",
    "vite": "^6.0.0"
  }
}

Steps to reproduce

1. Install both Vue - Official (v3.2.5) and Astro (v2.15.x) extensions
2. Clone the repro, run npm install, open in VS Code
3. Open src/App.vue
4. Place cursor inside the :icon="" prop on the <FontAwesomeIcon> component
5. Type faL — no suggestions appear

What is expected?

Auto-import suggestions should appear in prop binding expressions, matching the behavior in <script setup> and open tags.

What is actually happening?

Context	Example	Auto-import works?
Vue <script setup>	import { faL█ }	Yes
Vue template open tag	<faL█	Yes
Vue template prop expression	:icon="faL█"	No
Astro component prop	icon={faL█}	Yes

All three Vue contexts work when Astro extension is disabled.

Link to minimal reproduction

https://github.com/tworonin/vue-astro-vscode

Any additional comments?

I happened to be in a project that used both Astro and Vue and noticed the behavior right away. Tried a few fixes, including disabling all extensions (except Vue) and re-enabling one by one until the conflict surfaced.

Created a companion issue on the Astro repo.

Apologies if I missed anything, please let me know and I will correct.

Thanks!

[apvd79]

vscode-bug.mov

[KazariEX]

This is because the volar in astro decorates (proxy) the language service, preventing the preprocess (property setting) of the language service in vue from taking effect.

[Princesseuh]

Hello, I'm from the Astro team. Is there something we can do here? We haven't touched our TypeScript plugin in a very long time.

[KazariEX]

See https://github.com/volarjs/volar.js/blob/44d58ae/packages/typescript/lib/node/proxyLanguageService.ts#L136-L152.

If a TS project applies multiple volar-based plugins, the first proxy will cause operations in subsequent plugins like languageService.getCompletionsAtLocation = ... to fail.

[UnluckyNinja]

It looks MDX extension (Suggested in Astro MDX doc) has a similar issue, causing volar's auto-completion to appear only when identifiers are fully typed (compatible with volar 3.1.5 though). It would be great if it could also be addressed.