vetur: "Cannot find name" and other problems with TypeScript-SFC
Info
- Platform: Win 10
- Vetur version: 0.22.1
- VS Code version: 1.37.0
Problem
Vetur underlines everything and gives errors like Cannot find name
all the time.
Reproducible Case
At the moment I’m not sure how to make a reproducible case. The project is closed source and I’m not the author of most of the code. I mostly hope, that someone has seen this behaviour before.
About this issue
- Original URL
- State: open
- Created 5 years ago
- Reactions: 20
- Comments: 39 (8 by maintainers)
Just encountered this issue as well, same situation as @msamsel
Steps taken to address:
@ktsn I hope this description will help you track down the error.
Same issue here. The way how I was able to make such error. VSCode: version: 1.47.1 Vetur: 0.24.0 MacOS: 10.15.5
anything.Vue
important part is to start extension with a capital letter.</template>
tag:anything.vue
test.Vue
nottest.vue
as it is an actual name of the file. It looks like something somewhere is cached.solution
In case anyone has the same issue I was having, I kept trying to do this
When I think I should’ve been doing this…
I encountered this issue this morning so hopefully this helps someone. I found two ways to fix this:
The easy way
%appdata%\Code\User\workspaceStorage
The hard way (and a deeper look into what’s going on under the hood)
%appdata%\Code\User\workspaceStorage
state.vscdb
file with a SQLite browser (I did this using DB Browser for SQLite)memento/workbenches.parts.editor
keyThe encoded JSON inside the value looks something like this where
<path>
is the path to your affected file:Internally, VSCode still holds a reference to the incorrectly named file, and correcting those references seems to resolve the issue. Nothing else in this thread worked for me except those two methods, and once the first one worked, I wanted to understand what the issue was. The
state.vscdb
file is a SQLite 3 format database.Ran into the same issue that @msamsel described as well, seems like it might be an issue with vs code and not Vetur. I tried to run
Vetur: Show corresponding virtual file and sourcemap
but I got an error saying that it ‘Failed to show virtual file. Make sure the current file is a .vue file.’Debugging the extension it looks like
vscode.window.activeTextEditor.document.fileName
holds on to the old file name with the incorrect casing, seems like vs code is caching this somewhere and not letting go of it when you rename a file but only change character casing. Pretty lame solution, but I ended up copying the contents of the file, made sure I did not have the file open in my instance of vs code, then ran:Clear Editor History
File: Clear Recently Opened
Search: Clear Search
Search: Clear Search History
Then pressed Ctrl+P and started typing the name of the file to ensure that all references to the old improperly cased file were gone. Somehow the file was still there so I ended up pressing the ‘X’ to the right of the result to manually remove it from my recently opened files. Closed VS Code, deleted the file, re-opened vscode, created a new file with the same name but correct casing, and copied in the contents of the old file.
Hello,
I was able to solve this problem by clearing vs cache in the following paths : C:\Users\[UserName]\AppData\Roaming\Code\Cache C:\Users\[UserName]\AppData\Roaming\Code\CacheData
It was a desperate action. May not be the correct thing to do but other given solutions did not work for me.
It’s ok. I will try to study it.
Yeah + 1 for @msamsel’s description. Same for me. Renaming the file is fine - try to name it back, get smacked in the face with a wall of red (even though everything looks legit).
I’m facing the same issue with the Volar extension
@msamsel thanks for the catch. I’m not sure why I wrote a syntax error in my example 😂. I’ve revised it to better reflect the point I intended to make, which is that “typescript users should use defineComponent for typescript to properly infer types inside the component” - vue3 TS docs.
I think I was getting an error at the time and switching to defineComponent fixed the error I was getting. It was a while ago though and I don’t remember haha. My apologies for anyone who found my original example confusing.
I tried deleting just the cache from appdata as recommended above, also tried clearing history in vscode itself and it still didn’t work.
Once I deleted the cache for all extensions and workspaces it seemed to finally clean up.