useStrapi breaks npm run generate

[kasperjha]

Version

@nuxtjs/strapi: v1.12.0
nuxt: v3.11.2

Reproduction Link

https://github.com/kasperjha/nuxtjs-strapi-generate-issue

In app.vue you'll find the following:

<template>
  <div>
    <h1>@nuxtjs/strapi payload extraction test</h1>
    <p>Data from the "test" collection should be prerendered below</p>
    <code>{{ data }}</code>
  </div>
</template>

<script setup lang="ts">
// this breaks on `npm run generate`
const strapi = useStrapi()
const data = await strapi.findOne('test');

// this useFetch example works as expected
// const strapiUrl = useStrapiUrl()
// const data = await useFetch(strapiUrl + '/test');
</script>

Steps to reproduce

• Create a test collection in your strapi instance
• Clone the repo, install dependencies and point the STRAPI_URL env variable to your instance
• Execute npm run generate in your terminal

The command fails

• (optionally) verify no failure when using commented example code instead

What is Expected?

I expect no errors to be thrown when running npm run generate.

What is actually happening?

npm run generate fails with the error messages

...
Errors prerendering:
[nitro 1:06:18 AM]   ├─ / (65ms)
  │ └── Error: [500] 
[nitro 1:06:18 AM] 

[1:06:18 AM]  ERROR  Exiting due to prerender errors.

  at prerender (node_modules/nitropack/dist/chunks/prerender.mjs:218:11)
  at async node_modules/nuxt/dist/index.mjs:3471:7
  at async build (node_modules/nuxt/dist/index.mjs:5001:5)
  at async Object.run (node_modules/nuxi/dist/chunks/build.mjs:95:5)
  at async Object.run (node_modules/nuxi/dist/chunks/generate.mjs:56:5)
  at async runCommand$1 (node_modules/nuxi/dist/shared/nuxi.9edf0930.mjs:1648:16)
  at async runCommand$1 (node_modules/nuxi/dist/shared/nuxi.9edf0930.mjs:1639:11)
  at async runMain$1 (node_modules/nuxi/dist/shared/nuxi.9edf0930.mjs:1777:7) 

[1:06:18 AM]  ERROR  Exiting due to prerender errors.
...