Vetur + auto import components using @nuxt/components broken

[99linesofcode]

• [x] I have searched through existing issues
• [x] I have read through docs
• [x] I have read FAQ
• [x] I have tried restarting VS Code or running Vetur: Restart VLS

Info

• Platform: WSL2
• Vetur version: v0.35.0
• VS Code version: 1.65.0

Problem

When attempting to Go to Definition by CTRL + clicking on a component (which is automatically imported by Nuxt from a sub directory of components/) inside a Vue template, the following error is displayed:

Support for automatically generating a tags.json file has been added to @nuxt/components since version 0.2.4. The team also introduced the necessary changes to Vetur in this PR.

From what I could gather, it looks like this externalTagProvider is simply not loaded. That, or I'm missing something from the documentation on how to enable support for it. Can anyone see what is going wrong here?

Reproducible Case

1. Set up a basic Nuxt.js project. Automatically importing components from the components/ directory is already enabled by default;
2. Create a nested directory and component structure as per the documentation;
3. Add the component to a template and attempt to Go to definition.
4. 💥

[99linesofcode]

I believe auto importing components is already enabled by default.

[JorgeVV]

#2567 helped me with this issue

[99linesofcode]

@JorgeVV thanks, that does actually provide me with a temporary workaround. But as I just commented in #2567 it doesn't correctly solve the issue.

[99linesofcode]

While it may seem that the globalComponents setting solves this issue (it might when you don't nest your components in subdirectories) it doesn't correctly solve the issue here. @nuxt/components allows you to dynamically import components from the components/ directory and any subdirectory there in. As is documented here:

https://nuxtjs.org/docs/directory-structure/components/#nested-directories

I believe this is actually a bug, possibly a very simple one to resolve for anyone familiar with the vetur code base relating to the nuxt external tag loader not being loaded correctly.

Anyone with a better understanding of the inner workings of Vetur or VSCode plugin development that could take a stab at this?

[99linesofcode]

Apologies, I tagged you guys in the wrong PR. Meant to draw your attention to this one instead:

@pi0 I realize this isn't your primary focus but perhaps you could take a stab at this since you also worked on the initial PR? cc: @octref

[giancarllorojas]

I'm facing the same issue. Would be nice if the "Go to definition" feature worked for nested directories when using Nuxt Components.

[pi0]

Hi @99linesofcode. I've no ideas about vue-editor-bridge.ts. We didn't make any noticeable change for Nuxt 2 and @nuxt/components but it might need some for latest version compatibility. @octref any hints are more than welcome would be happy to help 🙏🏼

[yoyo930021]

You mix two problems in this issue.

Do we support nuxt built-in components?

Yes, we support it. The tags.json externalTagProvider will provide it.

Do we support nuxt auto import components?

No, we did not support him directly. You can use global component feature to support it. Ref: https://github.com/vuejs/vetur/issues/2567#issuecomment-747286928 We don't have any method to detect auto component in project. Except we write nuxt need it.

In this case, I think it's a good idea to use the config method.