vuejs / pinia

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

TS(7022): implicitly has type 'any' because it does not have a type annotation and is referenced directly or indirectly in its own initializer #2619

Closed JK-Effects closed 6 months ago

JK-Effects commented 6 months ago

Reproduction

https://play.pinia.vuejs.org/#eNqNVcFu2zAM/RXCOywGGmlFtx68JG03FNgGbCvaAjvMO7g2k6q1ZUFS0gSB/32U5DhOZhTzSaJI6r1Hkd5GV0qx1RKjJJqYXAtlwaBdKigzuZimkTVpNEulqFStLWxhafAWF8JYnVlRS3Nna43QwFzXFbxlXPcPmTVvU5nKnNaU17tOh1OM4lROeEBA99HGYqXKzCLtACZ5TQgkSguJMITLJ2NZbsUKb7IFss4hjYBTzIR3CaKTKOAfV5liT6aWxHbr0qbtAZFMwFucTQkpMmdJI+7XDE01ftD1i0FN8Wl0snO9JOl4gStb16UZZ0qEsEdrlUk4zwtJ/gWWYqWZRMulqvg/MZfn7AM75aV44HQRF7LA9eE1FDEusPqf7DvXy3fs9D0791lXZ23SymV1SZtUNiSLNVSauVgcieK0FCXqn8oX6ECcrCzrl2/eZvUSO4j5I+bPA/Ynsw6obzSSfCvs0bKZXiAVzB1f3/3ANa27w6ouliV5v3J4i6Yulw5jcPu0lAXB7vl5tF99jYVc3JvrtUVpdqQcUK+G9/cyf36F+h7uGTvrqXj85knIrl8KnAuJB13SPbCPvb4yjx7qLc5P2pgrs5G5gxOefRdMIH1oKnHtg+1GIRxgcA1x76xT8n9j0RDofoSQFvU8ywfCvtf0ngLlZ9wkw3kpF0DXcAlkckMmUqO7IXT88LCY9kUZpYfyeSMVMEAwlvo3gVEM09muDprGk5a7HUCYAa78LVPIzDDs9lUAKDKYBH7v9rDP5j5PvEvXRbmvR3pfsdFQwUYBdCgwsTwajfyekrvBm0ZxHPfuCG/RfX8ckSuts81kuEyz1rXx9QiB9ECptkSuZbSfkCSjl9PDCkvmhWAEvhiNlD9QjNjDdBqkbwdsDBcXsG3iQWU9FH+3Q9DEBOa4Jzqy7i+zn+vaT3Y1+4IkJPyqdVlMuPL2/vRu/gIPe0II

Steps to reproduce the bug

! Typescript / intellisence error (does not occur inside online editor, occurs locally in vscode)

  1. Define Store as in Documentation
  2. Pass DefineAsyncComponent to state with filename of store included anywhere in the folderpath of the component import string.

example with store-filename: registrations.ts causing an error: shallowRef(defineAsyncComponent(() => import("@/views/registrations/Mail.vue"))) causing an error: shallowRef(defineAsyncComponent(() => import("@/views/registrationsPages/Mail.vue"))) causing no error: shallowRef(defineAsyncComponent(() => import("@/views/registration/Mail.vue"))) causing no error: shallowRef(defineAsyncComponent(() => import("@/views/registration/registrations.vue"))) causing no error: shallowRef(defineAsyncComponent(() => import("@/views/registrations_Pages/Mail.vue")))

Expected behavior

No displayed typeerror

Actual behavior

Typeerror of store causes typeerrors inside components

Additional information

The following error only affects intellisense with the display of types. Since the type cannot be created in the store file, this also results in a lack of type recognition in the entire project.

In vscode I get a type error when I define a Piniastore where in the state the store's filename appears in some way in a defineAsyncComponent file path. This is because I store components in the store, which are then displayed in a component tag. If I change the file path accordingly so that the file name of the store no longer appears in the defineAsyncComponent, the type error is gone.

image

If I change the file path accordingly so that the file name of the store no longer appears in the defineAsyncComponent, the type error is gone. image

posva commented 6 months ago

Maybe you need to type the state return type but if this doesn't happen in the playground, it's likely related to your environment or volar