Not compatible with i18n module

[vhovorun]

When using this addon with i18n config together it breaks and show the next issue _a.decline is not a function TypeError: _a.decline is not a function at http://localhost:6006/node_modules/.cache/.vite-storybook/deps/@storybook_vue3.js?v=b30944e5:33:91

example of how i18n config is configured below:

import '../assets/styles/main.scss';
import { type Preview,  setup } from '@storybook/vue3';
import en from '@/locales/en.json';
import es from '@/locales/es.json';
import de from '@/locales/de.json';
import fr from '@/locales/fr.json';
import pl from '@/locales/pl.json';
import pt from '@/locales/pt.json';
import sv from '@/locales/sv.json';
import tr from '@/locales/tr.json';
import { createI18n } from 'vue-i18n';

const preview: Preview = {
  parameters: {
    layout: 'centered',
  },
};

const i18n = createI18n({
  langDir: "locales",
  messages: {
    en,
    es,
    de,
    fr,
    pl,
    pt,
    sv,
    tr
  },
  defaultLocale: "en",
  legacy: false,
  locale: "en",
});

setup((app) => {
  app.use(i18n);
});

export default preview;

P.S Without this addon it works correctly. I would be very thankful for some help, thanks in advance

[hirotaka]

Nuxt has many modules and requires some effort to support. I am willing to support a variety of modules, including the commonly used i18n module, and will try to provide support for it. Unfortunately, the addon's basic functionality is not fully operational yet, and support for individual modules will take time.

[LeCoupa]

Hey @hirotaka, I am new to Storybook with Nuxt but I was wondering why we don't update https://storybook.nuxtjs.org/ ?

[fransyrcc]

Hello,

I've tried https://storybook.nuxtjs.org/ but it seems it does not work with latest Nuxt 3 version. It is intended to work for nuxt>=2.15.3 according to the documentation.

I've a set up Nuxt 3 and tailwindcss with storybook-addon-nuxt and works great and it is simple to install/use.

However, I found the same problem in this issue. Instead of i18n I have the issue with Pinia. (I'm not integrated it with i18n yet) I'm using this integration https://storybook.js.org/recipes/pinia which works fine for Vue3 + Pinia.

Packages versions:

• "nuxt": "3.5.2"
• "@pinia/nuxt": "0.4.11",
• "@storyblok/nuxt": "5.4.7",
• storybook-addon-nuxt:1.3.3

Issue

TypeError: _a.decline is not a function
    at http://localhost:6006/node_modules/.cache/.vite-storybook/deps/@storybook_vue3.js? 

[mr-tkachuk]

Hey there, guys. @hirotaka I just wanted to say, that I have the same problem

At first i tried to use it with app.use(pinia), or with some directives like app.directive('maska', vMaska)

But all the times even with empty setup( (app) => {

}) function in main.ts I have the same error TypeError: _a.decline is not a function at http://localhost:6006/node_modules/.cache/.vite-storybook/deps/@storybook_vue3.js?v=ab906dbf:29:91

[CernyMatej]

Any updates on adding support for the i18n module?

[jojomatik]

P.S Without this addon it works correctly. I would be very thankful for some help, thanks in advance

@vhovorun do you have an working example with nuxt 3, i18n and storybook? If so, would you be able to share or give some directions? I'm trying to set these three up, tried it with and without this addon but didn't succeed...