fix: throw when a store is used outside of a Nuxt-aware context.

packages/nuxt/playground/pages/usage-after-await.vue

@@ -0,0 +1,24 @@
+<script lang="ts" setup>
+const useFancyCounter = async () => {
+  await new Promise((resolve) => setTimeout(resolve, 0))
+
+  // ❌ bad usage: the use of a store after an await could lead to using the wrong pinia instance.
+  return useCounter()
+}
+
+const event = useRequestEvent()
+useNuxtApp().hook('vue:error', (error) => {
+  if (event) {
+    setResponseStatus(event, 500, String(error))
+  }
+})
+
+const counter = await useFancyCounter()
+</script>
+
+<template>
+  <div>
+    <p>Count: {{ counter.$state.count }}</p>
+    <button @click="counter.increment()">+</button>
+  </div>
+</template>

packages/nuxt/src/runtime/composables.ts

@@ -1,4 +1,27 @@
 import { useNuxtApp } from '#app'
+import {
+  defineStore as _defineStore,
+  type Pinia,
+  type StoreGeneric,
+} from 'pinia'
 export * from 'pinia'
 
-export const usePinia = () => useNuxtApp().$pinia
+export const usePinia = () => useNuxtApp().$pinia as Pinia | undefined
+
+export const defineStore: typeof _defineStore = (
+  ...args: [idOrOptions: any, setup?: any, setupOptions?: any]
+) => {
+  if (!import.meta.server) {
+    return _defineStore(...args)
+  }
+
+  const originalUseStore = _defineStore(...args)
+  function useStore(pinia?: Pinia | null, hot?: StoreGeneric): StoreGeneric {
+    return originalUseStore(pinia || usePinia(), hot)
+  }
+
+  useStore.$id = originalUseStore.$id
+  useStore._pinia = originalUseStore._pinia
+
+  return useStore
+}

packages/nuxt/test/nuxt.spec.ts

@@ -33,4 +33,10 @@ describe('works with nuxt', async () => {
     expect(html).not.toContain('I should not be serialized or hydrated')
     expect(html).toContain('skipHydrate-wrapped state is correct')
   })
+
+  it('throws an error server-side when the nuxt context is not available', async () => {
+    await expect($fetch('/usage-after-await')).rejects.toThrowError(
+      '[nuxt] instance unavailable'
+    )
+  })
 })