Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Bug: IDE Auto Import/Quick Fix Not Working for Vue Package Component in Template #4865

Open
incutonez opened this issue Sep 22, 2024 · 5 comments
Labels
bug Something isn't working 🍰 p2-nice-to-have

Comments

@incutonez
Copy link

incutonez commented Sep 22, 2024

Vue - Official extension or vue-tsc version

2.1.6

VSCode version

1.93.1

Vue version

3.5.8

TypeScript version

5.6.2

System Info

System:
    OS: Windows 11 10.0.22631
    CPU: (16) x64 Intel(R) Core(TM) i9-9900K CPU @ 3.60GHz
    Memory: 17.34 GB / 31.85 GB
  Binaries:
    Node: 20.13.1 - C:\Program Files\nodejs\node.EXE
    npm: 10.8.1 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Edge: Chromium (127.0.2651.74)
    Internet Explorer: 11.0.22621.3527

package.json dependencies

{
    "@incutonez/my-package": "^0.0.4",
    "vue": "^3.5.8"
}

Steps to reproduce

  1. Clone my repo
  2. cd repo && npm i
  3. Goto App.vue
  4. Remove the imports
  5. Use the quick fix menu "ctrl+." to import TestValue successfully
  6. Try to use the quick fix menu to import ComponentA in the template, but see that it's not possible
  7. Manually start typing out the import for ComponentA in the script and see that the IDE allows you to auto-complete

What is expected?

I should be able to see my component's name in the quick fix menu. Maybe my custom package is set up incorrectly, but this seems like a tooling issue.

What is actually happening?

I can't see my component in the quick fix menu.

Link to minimal reproduction

https://github.com/incutonez/ide-import-issue

Any additional comments?

Here's a recording of what I'm talking about. I've also tried to import in IntelliJ, and I get the same issue that VSCode has.

Recording.2024-09-22.172535.mp4
@incutonez incutonez changed the title Bug: IDE Auto Import/Quick Fix Not Working for Custom Library Bug: IDE Auto Import/Quick Fix Not Working for Vue Package in Template Sep 23, 2024
@incutonez incutonez changed the title Bug: IDE Auto Import/Quick Fix Not Working for Vue Package in Template Bug: IDE Auto Import/Quick Fix Not Working for Vue Package Component in Template Sep 23, 2024
@KazariEX KazariEX added bug Something isn't working 🍰 p2-nice-to-have and removed pending triage labels Sep 23, 2024
@KazariEX
Copy link
Collaborator

KazariEX commented Sep 23, 2024

Please refer to #2304.

If you want to get warning on unimported components, you can try enabling vueCompilerOptions.strictTemplates in tsconfig.json.

@incutonez
Copy link
Author

If you want to get warning on unimported components, you can try enabling vueCompilerOptions.strictTemplates in tsconfig.json.

I tried this, and while the quick fix still doesn't work, I do get a red squiggle error, which I have been wanting for a long time (image below). Did not realize that vueCompilerOptions was becoming a thing in tsconfig.json. Thank you for pointing that out!

image

@KazariEX
Copy link
Collaborator

In theory, you should be able to use the tab completion to achieve the same fix effect.

@incutonez
Copy link
Author

In theory, you should be able to use the tab completion to achieve the same fix effect.

Oh, that's interesting... that does work in VSCode, however, it doesn't work in IntelliJ. Still, ctrl+. doesn't work, even after tab completing. Really bizarre.

@victorgarciaesgi
Copy link

What's blocking me to use strictTemplates is that it reports error for extra attributes, like putting a data-xattribute on a div, I don't know why this setting isn't splitted into 2 options (imports and props)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working 🍰 p2-nice-to-have
Projects
None yet
Development

No branches or pull requests

3 participants