vuejs / pinia

🍍 Intuitive, type safe, light and flexible Store for Vue using the composition api with DevTools support
https://pinia.vuejs.org
MIT License
12.91k stars 1.02k forks source link

`_UnwrapAll` not working when pinia stores is from npm package #2591

Closed szulcus closed 6 months ago

szulcus commented 6 months ago

Reproduction

I can't reproduce it from playground

Steps to reproduce the bug

For context, I use Nuxt Layers and @pinia/nuxt module.

  1. Definie auto imports in nuxt.config.ts:
    export default defineNuxtConfig({
    // ...
    imports: {
        dirs: ['stores', 'node_modules/@frontend/nuxt-layer-base/stores'],
    },
    });
  2. Use autoimported store from npm package:
    const f24BaseStore = useF24BaseStore();
  3. Use variable from this store:
    console.log(f24BaseStore.toasts);
  4. Show type definitions i get type of reactive variable (wrapped with { value: ...; [RefSymbol]: true; })

Expected behavior

image

Actual behavior

image

Additional information

In local stores all works fine. For woraround I have this in index.d.ts:

import { UnwrapRef } from 'vue';
// import { _UnwrapAll } from 'pinia';
export {};

type _UnwrapAll<SS> = {
    [K in keyof SS]: UnwrapRef<SS[K]>;
};
declare global {
    const useF24BaseStore: () => _UnwrapAll<ReturnType<(typeof import('@frontend/nuxt-layer-base/stores/base'))['useF24BaseStore']>>;
}
posva commented 6 months ago

You need to ensure they all import from the same Vue package. Make sure pinia and vue are externalized