primefaces / primevue

Next Generation Vue UI Component Library
https://primevue.org
MIT License
10.51k stars 1.23k forks source link

Typescript support is non-existent in All components #6152

Closed rafaelsmgomes closed 1 month ago

rafaelsmgomes commented 3 months ago

Describe the bug

I get no typescript support on my template section with Primevue. There is no destructuring, no way of knowing what props do I need to pass to the template slots. It's really bad. I thought the problem was just mine, but I don't think so. I use neovim, so I tried fumbling with the configuration (mind you this does not happen with other 3rd-party components). Then I gave up and switched to VSCode, still nothing. Dug through the documentation, basically almost no mention to typescript, except to say it has stellar support. One of my coworkers has the exact same problem. So I don't think this is just me.

And there is no word anywhere of this issue. Either we're the only people facing this or most users don't use typescript.

If I'm wrong, please point to me where in the docs do I need to look to set this up to work.

Best

Reproducer

I also don't get hints on stackblitz

PrimeVue version

4.0.0-rc.2

Vue version

4.x

Language

TypeScript

Build / Runtime

Vue CLI App

Browser(s)

No response

Steps to reproduce the behavior

Just start a regular project with the recommended Vue build script. Then follow the steps to install Primevue.

Expected behavior

I expected some hints on the templates section, maybe I should not expect those.

cagataycivici commented 3 months ago

I'll check with the team, thanks. We are not aware of any issues until now but worth checking because the team spends a lot of time on type checking.

tugcekucukoglu commented 3 months ago

Vue recommends activating the Volar extension for VSCode after disabling Vetur. Have you had a chance to try this?

rafaelsmgomes commented 3 months ago

Yes, using Volar with Typescript with the recommended configuration for Nvim. I did try all the possible iterations of the recommended setup. Also tried on VSCode. This is just the default setup. Tried this with multiple projects, still not getting any type checking on my project.

The weird thing is that other components have type-checking just fine.

Here is some screenshots for example:

image image
rafaelsmgomes commented 3 months ago

I do get type checking on the script part though.

image
rafaelsmgomes commented 3 months ago

Just by sheer amounts of tries, I've had it working sometimes when my main typescript configuration breaks. For some reason, when I change the tsconfig and save without reloading, the typechecking will work on the primevue elements, but break everywhere else. If I restart the TSServer, then it will stop working for Primevue, but work for the rest of the project again.

Very weird. I've changed my configuration in every each way, still getting this error.

Again, the weird part is that other 3rd party components work just fine

tugcekucukoglu commented 3 months ago

Could you try to fork and use this example locally? Also, sharing a demo or a repo with your setup helps us.

rafaelsmgomes commented 3 months ago

Nope, might have spoken too soon. Well, it did work for me locally. I'm gonna try to play around with this and will give you an update. Not sure where the problem is though. I'll try to build a new repo from scratch and test it again. I'll share that with you guys. Can't share our current repos cause they are work related.

rafaelsmgomes commented 3 months ago

Still can't get it to work on my work project, but running from your default setup there has been some typing.

image

Although it quickly deteriorated. For some reason this typing on the props was working 5 minutes ago, and now it no longer is...

image

This is your own repo that you shared. I had the exact same result with a clean repo started with bun create vue@latest

rafaelsmgomes commented 3 months ago

Same result in VSCode. I also don't use VSCode a lot, so this is the recommended setup for it. Basically only installed Vue stuff.

image
tugcekucukoglu commented 3 months ago

A demo or a repository that we can test on would be very useful.

Ripwords commented 3 months ago

I'm not 100% but i think it's related to our issue as well #6126

UPDATE: Just noticed the 4.0.4 release, installed it, #6126 is now resolved

rafaelsmgomes commented 3 months ago

Updating to 4.0.4 did not solve this for me.

I want to understand if I should not expect to have type-safety in slots while using the library.

image

Here, this is a bare repo started with the recommended way (bun create vue@latest) with typescript.

Let me know if this is a configuration issue on my side or not. Because right now, nor me nor my coworker can get this to work.

https://github.com/rafaelsmgomes/vue-test/tree/main

nicolascvoodoo commented 3 months ago

Same issue here on VSCode + Vue (official) extensions and primevue@4.0.4. (macOS 14.5)

nicolascvoodoo commented 3 months ago

It may be related to https://github.com/primefaces/primevue/issues/6060

i7slegend commented 3 months ago

It may be related to #6060

It's also reference to #5903 (already under team review), nearly to #6051 (nuxt module) and maybe to #6178

jmroon commented 2 months ago

To the PrimeVue team. The issue is the DefineComponent used in @primevue/core.

image

When the import is replaced with DefineComponent from vue, intellisense works as expected for props. I'm sure it's not a fully solution as M and E aren't being spread to the proper generic arguments, but I think there might be an issue with some of the empty objects being passed as args.

image

jmroon commented 1 month ago

Okay yeah I see the problem. The empty objects are overriding generics that are based on P. I'll submit a PR.

nicolascvoodoo commented 1 month ago

Hey guys, any news about this?

Eirmas commented 1 month ago

I created a PR to fix this https://github.com/primefaces/primevue/pull/6477

maersk96 commented 1 month ago

Experiencing the same issue (v.4.1.0)