Storybook build with i18n not worked

Question

On a nuxt3 project i have a library of components using storybook

For example this component with a translation:

<script setup lang="ts">
const { t } = useI18n()
</script>

<template>
    <span>{{ t('components.location.backLink.text') }}</span>
</template>

This component with i18n works fine when i work on the project (nuxt dev) and when i execute the story. But when i build the story i can see this following error display:

The problem is when storybook is build in static we don't have acces to nuxt and the i18n setup.

There is my i18n.config:

import fr from './translations/fr.json'
import en from './translations/en.json'

export default defineI18nConfig(() => {
  return {
    legacy: false,
    locale: 'en',
    messages: {
      en,
      fr,
    },
  }
})

And my nuxt.config:

export default defineNuxtConfig({
  ..., // other config options
  i18n: {
    locales: ['fr', 'en'],
    vueI18n: './i18n/i18n.config.ts',
  },
})

I try multiple way, the common is inside the preview file of storybook use the setup function and use app.use(i18n). But every problem solving is for vue3 and seems to not work for my case.

import type { Preview } from '@storybook/vue3'
import i18n from '../i18n/i18n.config'

setup((app) => {
  app.use(i18n) // I try createI18n() too, but same error
})

const preview: Preview = {
  parameters: {
    actions: { argTypesRegex: '^on[A-Z].*' },
    controls: {
      matchers: {
        color: /(background|color)$/i,
        date: /Date$/,
      },
    },
  },
}

export default preview