language-tools: False positive errors at end-of-file

@GCnomore From here:

This should also disable auto-updating this particular addon.

FWIW, I was having the same conflict with styled-components.vscode-styled-components. I double checked that installing it introduces “Block-scoped variable ‘__VLS_3’ used before its declaration.” and uninstalling removes the error instantly.

I also tried to migrate to 2.0 in an existing project, did all the steps mentioned in the instructions. I also do not get any typescript assistance in my templates. This results in script variables being marked as unused. Will downgrade to 1.x for now.

I can’t reproduce the problem in this repo.

@johnsoncodehk Here’s the ls output from $HOME/.vscode/extensions. I don’t have the time or inclination to check these 1 by 1 (nor should I have to, this should have been much more thoroughly tested before releasing…). Some of them are not active. (For instance, I have disabled vscode-typescript-vue-plugin when trying 2.x.x etc.)

4ops.terraform-0.2.5                         hecate-theme                                 pkief.material-icon-theme-4.34.0
be5invis.vscode-icontheme-nomo-dark-1.3.6    irongeek.vscode-env-0.1.0                    prisma.prisma-5.10.2
bierner.markdown-checkbox-0.4.0              jock.svg-1.5.3                               ritwickdey.liveserver-5.7.9
bierner.markdown-emoji-0.3.0                 mgmcdermott.vscode-language-babel-0.0.40     rvest.vs-code-prettier-eslint-6.0.0
bradlc.vscode-tailwindcss-0.10.5             mikestead.dotenv-1.0.1                       salesforce.sfdocs-markdown-assistant-0.1.6
dbaeumer.vscode-eslint-2.4.4                 mquandalle.graphql-0.1.2                     streetsidesoftware.code-spell-checker-3.0.1
dracula-theme.theme-dracula-2.24.3           ms-azuretools.vscode-docker-1.29.0           stylelint.vscode-stylelint-1.3.0
dsznajder.es7-react-js-snippets-4.4.3        ms-python.autopep8-2023.8.0                  syler.sass-indented-1.8.29
eamodio.gitlens-14.8.2                       ms-python.black-formatter-2024.0.1           tyriar.sort-lines-1.11.0
extensions.json                              ms-python.debugpy-2024.2.0-darwin-arm64      vscode-icons-team.vscode-icons-12.7.0
firefox-devtools.vscode-firefox-debug-2.9.10 ms-python.isort-2023.10.1                    vue.volar-1.8.27
formulahendry.auto-rename-tag-0.1.10         ms-python.python-2024.2.1                    vue.volar-2.0.5
github.vscode-github-actions-0.26.2          ms-python.vscode-pylance-2024.2.3            vue.vscode-typescript-vue-plugin-1.8.27
graphql.vscode-graphql-0.9.3                 ms-vsliveshare.vsliveshare-1.0.5918          xabikos.javascriptsnippets-1.8.0
graphql.vscode-graphql-execution-0.2.6       oderwat.indent-rainbow-8.3.1                 yummygum.city-lights-icon-vsc-1.1.3
graphql.vscode-graphql-syntax-1.3.4          orsenkucher.vscode-graphql-0.3.18

After investigation from https://github.com/microsoft/TypeScript/issues/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.

@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.

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

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

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

To me, styled-components.vscode-styled-components@v1.7.8 was the culprit. Only it coflicted with vue.volar@v2.0.5 and others were fine.

You haven’t paid for it and haven’t contributed to it. Therefore, nobody here owes you anything.

@davidmatter Fair enough. For what it’s worth, though, I am contributing in the only way I have the capacity to do at the moment, which is by participating in this discussion. I don’t feel entitled to anything here but I also don’t think it’s a problem to point out that this is a pretty big bug to go unnoticed in a major release of a tool that a lot of people depend on and that (as far as I know) has no viable alternatives in the marketplace, open source or otherwise.

I take your point about the complexity of the thing, though. Maybe if I have the capacity at some point, I’ll come back and contribute more to this.

I don’t have the time or inclination to check these 1 by 1 (nor should I have to, this should have been much more thoroughly tested before releasing…)

@joshuagraber this is an open source tool. You haven’t paid for it and haven’t contributed to it. Therefore, nobody here owes you anything.

Edit: Additionally, for your better understanding, language tooling and editor extensions are a massively complex thing. There are hundreds of ways how, for example, other installed extensions in other versions, hundreds of different project and typescript configurations, different operating systems, different node versions, electron versions etc. can interfere with how an extension behaves in your specific context.

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 thanks. downgrading to v1.8.27 fixed my errors

It seems that the problem is not specific to Svelte extension or styled-components.vscode-styled-components. As long as a runtime error occurs in a TS plugin extension you installed, tsserver will discard all changes made by TS plugins to the language service and fall back to the original language service instance. Svelte extension and styled-components.vscode-styled-components are two of the cases but not all.

The solution is to manually find the TS plugin where the error occurred and disable the extension. You can execute the TypeScript: Open TS Server log command to find the relevant error log, or disable your extensions one by one. I will add some guidance in the doctor panel.

If you identify an extension that is causing problems for you, please share it here.

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 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?

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 typescript@4.9.5

it works fine typescript@5.3.2

I would like you to check your current Typescript version.

@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!

@GCnomore as show by @thany

4ops.terraform-0.2.5                         hecate-theme                                 pkief.material-icon-theme-4.34.0
be5invis.vscode-icontheme-nomo-dark-1.3.6    irongeek.vscode-env-0.1.0                    prisma.prisma-5.10.2
bierner.markdown-checkbox-0.4.0              jock.svg-1.5.3                               ritwickdey.liveserver-5.7.9
bierner.markdown-emoji-0.3.0                 mgmcdermott.vscode-language-babel-0.0.40     rvest.vs-code-prettier-eslint-6.0.0
bradlc.vscode-tailwindcss-0.10.5             mikestead.dotenv-1.0.1                       salesforce.sfdocs-markdown-assistant-0.1.6
dbaeumer.vscode-eslint-2.4.4                 mquandalle.graphql-0.1.2                     streetsidesoftware.code-spell-checker-3.0.1
dracula-theme.theme-dracula-2.24.3           ms-azuretools.vscode-docker-1.29.0           stylelint.vscode-stylelint-1.3.0
dsznajder.es7-react-js-snippets-4.4.3        ms-python.autopep8-2023.8.0                  syler.sass-indented-1.8.29
eamodio.gitlens-14.8.2                       ms-python.black-formatter-2024.0.1           tyriar.sort-lines-1.11.0
extensions.json                              ms-python.debugpy-2024.2.0-darwin-arm64      vscode-icons-team.vscode-icons-12.7.0
firefox-devtools.vscode-firefox-debug-2.9.10 ms-python.isort-2023.10.1                    vue.volar-1.8.27
formulahendry.auto-rename-tag-0.1.10         ms-python.python-2024.2.1                    vue.volar-2.0.5
github.vscode-github-actions-0.26.2          ms-python.vscode-pylance-2024.2.3            vue.vscode-typescript-vue-plugin-1.8.27
graphql.vscode-graphql-0.9.3                 ms-vsliveshare.vsliveshare-1.0.5918          xabikos.javascriptsnippets-1.8.0
graphql.vscode-graphql-execution-0.2.6       oderwat.indent-rainbow-8.3.1                 yummygum.city-lights-icon-vsc-1.1.3
graphql.vscode-graphql-syntax-1.3.4          orsenkucher.vscode-graphql-0.3.18

@joshuagraber Only Vue.volar and Vue.vscode-typescript-vue-plugin from this list define the TypeScript Plugin, so your problem may be OS specific. (This is just speculation, I can’t confirm it without being able to reproduce it.)

@thany You just need to disable vscode-styled-components in Vue workspaces.

I have this same problem, I tried to disable my extensions and it was the same result, I even created a simple repository, without typescript and still the error appears.