vuejs / pinia

🍍 Intuitive, type safe, light and flexible Store for Vue using the composition api with DevTools support

Home Page:https://pinia.vuejs.org

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Typings for refs seem to be wrong in setup store

MickL opened this issue · comments

Reproduction

Steps to reproduce the bug

It seems like the typings are not correct when using setup stores. Or is it just my IDE (WebStorm) ?

export const useProductStore = defineStore('product', () => {
    const item = ref<Product>();

    // ...

    return { item };
});

Here we have a ref within a store but when using the store it is just a normal variable:

<script setup lang="ts">
   const store = useProductStore();
   console.log(store.item.company); // Correct !
   console.log(store.item.value.company); // Not correct !
</script>

But my IDE suggest to use store.item.value.company even tho this is wrong:

Bildschirmfoto 2024-03-15 um 17 56 25

Stackblitz:
https://stackblitz.com/edit/nuxt-starter-yr48pf?file=app.vue

You are likely including multiple versions of vue and the types get messed up. Remember to always search before opening new issues and also to include a reproduction. I think I’ve seen this in discussions already

I was looking for it but I couldnt find it, do you have a link? I am on latest for everything:

- Operating System: Darwin
- Node Version:     v21.6.1
- Nuxt Version:     3.10.3
- CLI Version:      3.10.1
- Nitro Version:    2.8.1
- Package Manager:  bun@1.0.29
- Builder:          -
- User Config:      extends, modules, runtimeConfig, routeRules, i18n
- Runtime Modules:  @nuxt/ui@^2.14.2
- Build Modules:    -
@pinia/nuxt: 0.5.1

Can we leave the issue open for now?

Stackblitz doent show TypeScript errors, but here it is:
https://stackblitz.com/edit/nuxt-starter-yr48pf?file=app.vue

To those who is getting this

Updating to typescript@5.4.x is the culprit to this wrong types