False positive errors at end-of-file

[johnsoncodehk]

TS plugin cannot be used with Vue files if the project does not contain tsconfig/jsconfig, or the Vue files are not included by tsconfig/jsconfig.

Steps to reproduce

1. Clone https://github.com/johnsoncodehk/volar-starter
   Since it is just for demonstration purposes, node_modules will not be installed.
2. Delete the tsconfig.json file in repo
3. Open the repo in VSCode, and open src/components/HelloWorld.vue
4. You should see TS errors reported due to missing dependencies, as shown below:
   
5. Close HelloWorld.vue, open src/main.ts, then re-open HelloWorld.vue
6. Errors in the image above is now displayed in the wrong location (end of file)
   

Exploration

@vue/typescript-plugin calls decorateLanguageService and decorateLanguageServiceHost at following code to modify the original languageService and languageServiceHost:

language-tools/packages/typescript-plugin/index.ts

Lines 62 to 63 in 3efa52d

	decorateLanguageService(files, info.languageService);
	decorateLanguageServiceHost(files, info.languageServiceHost, ts);

This works well for ConfiguredProject. But for InferredProject, if you open the TS file before opening the Vue file, the modification of decorateLanguageService is no longer valid, just like the original languageService is no longer used. Therefore the mapping behavior of decorateLanguageService is no longer valid.

Temporary Solutions

1. Create a jsconfig.json file in project root with empty json object content {}
2. Downgrade to 1.8.27 for now

Update: If you have the "Svelte for VS Code" extension installed, disabling it may avoid this problem.

[Bobakanoosh]

This happens to me in a monorepo containing some nuxt projects as well.

[hi-reeve]

using nuxt, now the autocomplete and suggestions does not work at all

[9mm]

I dont know if this is related but i used to use volar + neovim (lspconfig) a lot in single files, just writing quick scripts in TS and that no longer works. I do see it works when tsconfig is in the root however.

Not sure if there is a way to make this optional, im assuming its the same as original issue here

[ElYaiko]

The only solution that worked for me for now is downgrading to 1.8.27

[dfidalg0]

Having a similar problem with Nuxt auto-imports. Here, SDropdown is an auto-imported component

Relevant information

Extension version: v2.0.5
Svelte extension is disabled
tsconfig.json is Nuxt's default

[dfidalg0]

Having a similar problem with Nuxt auto-imports. Here, SDropdown is an auto-imported component

Relevant information

Extension version: v2.0.5 Svelte extension is disabled tsconfig.json is Nuxt's default

When I change it to SDropdown, the error is mostly gone, but I still get this (incorrect) error

[johnsoncodehk]

After investigation from microsoft/TypeScript#57630, this does appear to be an issue with the Svelte extension. Please make sure you have disabled the Svelte extension in Vue workspace. If you don't have Svelte extension installed and this problem still occurs, please open a new issue and provide a reproduction.

[namhong2001]

Yeap. It seems the extension crashes with some others. Thanks @johnsoncodehk I also disabled not using extensions and errors gone.

[johnsoncodehk]

@namhong2001 Can you share which extension caused the conflict for you?

[emojiiii]

same error in 2.0.6:

Extension	Author (truncated)	Version
iconify	ant	0.7.5
unocss	ant	0.58.5
postcss	css	1.0.9
dart-code	Dar	3.84.0
flutter	Dar	3.84.0
vscode-eslint	dba	2.4.4
gitlens	eam	14.9.0
prettier-vscode	esb	10.1.0
copilot	Git	1.172.0
copilot-chat	Git	0.13.0
gc-excelviewer	Gra	4.2.59
debugpy	ms-	2024.2.0
python	ms-	2024.2.1
vscode-pylance	ms-	2024.2.3
sqlite-viewer	qwt	0.3.13
autoimport	ste	1.5.4
svga-perview	svg	1.0.0
intellicode-api-usage-examples	Vis	0.2.8
vscodeintellicode	Vis	1.2.30
volar	Vue	2.0.6
vscode-import-cost	wix	3.3.0

[DanielLemosGebit]

@thany vscode-styled-components has been mentioned to cause conflicts, please try uninstall. Also make sure to uninstall vscode-typescript-vue-plugin when using 2.0.x.

I'm removed vscode-styled-components and worked, thanks!

[cooldevdotcodes]

I have error message shows that the tsconfig is missing but it does exist. I found that disabling styled-jsx Language Server extension (https://marketplace.visualstudio.com/items?itemName=Divlo.vscode-styled-jsx-languageserver) and the error is gone.

[Ernildo]

I don't know what the relationship is, but when the styled-componets extension was enabled, the Vue - Oficial plugin stopped working correctly from version 2.x onwards. Therefore, until the problem is fixed, there are two possible paths:

1. Downgrade of "Vue - Oficial" to version 1.8.x
   or
2. Disable the styled-components plugin

[xak2000]

In my case only the option 1 has helped. I don't know what styled-components plugin is. Never installed it, so nothing to disable, but Vue extension v2.x has still stopped to work after several minutes after each restart of VS Code. Dowgrading to 1.x has helped.

[thany]

stopped to work after several minutes after each restart of VS Code

That feels like a different problem? The addon doesn't stop working (it spews out errors, but it otherwise fine, mostly), and certainly not after a few minutes (immediately for me, after initialising).

[XxGodmoonxX]

Wouldn't it work if I increased the version of TypeScript I'm using?
https://github.com/vuejs/language-tools/blob/master/CHANGELOG.md#206-202437

Vue - Official @2.0.6

Doesn't work well
[email protected]

it works fine
[email protected]

I would like you to check your current Typescript version.

[thany]

@johnsoncodehk You closed this issue, which is fine, but are we absolutely sure the problem wasn't in this addon? The problem only occurred with a combination of this addon, and the styled-components one. Just telling people not to install the latter one, is not a solution, even if the problem is in that addon.

By closing this issue, it feels like you're sure the problem (and solution) is in the styled-components addon. So one more time then: is some type of collaboration with them being done to get to an actual proper solution?

[adufr]

@thany I think this issue has been closed because the change that caused it has been reverted -> so it's now fixed.

[so1ve]

@thany "Closed via" means a PR or a commit had fixed this issue, and a new release is coming.

Just upgrade to 2.0.7.

[thany]

That PR just reverts back to the same thing the old addon version did, so the issue only appears solved. When going into hybrid mode (presumably, from the looks of the PR) it will still break in the exact same way.

This is why I keep asking to collaborate with the author of the addon that it is breaking on. Working together might actually solve the problem.

[so1ve]

When going into hybrid mode

You should only enable hybrid mode when you have a tsconfig and have ts 5.3+ installed.

keep asking to collaborate with the author of the addon that it is breaking on

Other ts plugins are not related. This is a vscode and typescript's fault-tolerance problem, not ours.

[thany]

You should only enable hybrid mode when you have a tsconfig and have ts 5.3+ installed.

This can easily be autodetected, can't it?

[sharifzadesina]

I have this problem with Nuxt. there is a tsconfig. but for every newly created file, I get the same behaviour unless I restart vscode.

[johnsoncodehk]

#4206 implements the detection of installed extensions to determine whether to enable Hybrid Mode automatically. If you find a compatible extension ID that is not added to the whitelist, please leave a comment in the PR.

[sharifzadesina]

@johnsoncodehk Why it is not able to find auto generated tsconfig Nuxt projects?! is there something wrong?

[yveeven]

I see the comments understand that the full TS server has been restored, so it would be best to be able to turn on Takeover mode to improve performance, but he still detects warnings every time I open the project, should I use some way to turn off the warnings or is there no need to disable the built-in server?

[so1ve]

There is no need to disable the built-in server. If hybrid mode is enabled, both typescript and vue files' language services are provided by the built-in server. If disabled, vue's language service is provided by an external language server.

[yveeven]

There is no need to disable the built-in server. If hybrid mode is enabled, both typescript and vue files' language services are provided by the built-in server. If disabled, vue's language service is provided by an external language server.

thank you

[yveeven]

On mac vs code open multiple windows at the same time may occasionally saving stuck out, forgive can not be determined to float, the situation is like this

System:
OS: macOS 14.0
CPU: (8) arm64 Apple M1 Pro
Memory: 62.98 MB / 32.00 GB
Shell: 5.9 - /bin/zsh
IDEs
VSCode: 1.88.0 - /usr/local/bin/code

[email protected]
[email protected]

vscode [email protected]