Console error when there is no .json translation file available

[Jacobtims]

When I don't have a .json translation file in my ./lang folder, I get an error in the console.

Specifications:

• Laravel 9
• Vue 3
• Inertia 1.0.0
• Laravel-vue-i18n 2.3.1

Situation:

• PHP Translations enabled in vite.config.js
• I only have .php translation files in the ./lang folder

Console Error:

Uncaught (in promise) TypeError: langs[lang] is not a function
    at resolve (app.js:24:66)
    at avoidException (avoid-exceptions.js:3:16)
    at I18n.resolveLangAsync (index.js:185:20)
    at index.js:159:18
    at new Promise (<anonymous>)
    at I18n.loadLanguageAsync (index.js:155:16)
    at I18n.load (index.js:129:61)
    at new I18n (index.js:113:14)
    at I18n.getSharedInstance (index.js:311:84)
    at Object.install (index.js:83:44)

The error is caused by this line of code in the app.js: return await langs[`../../lang/${lang}.json`]();

I added a temporary workaround: if (typeof langs[`../../lang/${lang}.json`] == "undefined") return;

App.js

import './bootstrap';
import '../css/app.css';

import { createApp, h } from 'vue';
import { createInertiaApp } from '@inertiajs/vue3';
import { resolvePageComponent } from 'laravel-vite-plugin/inertia-helpers';
import { ZiggyVue } from '../../vendor/tightenco/ziggy/dist/vue.m';

import {i18nVue, trans} from 'laravel-vue-i18n'

const appName = window.document.getElementsByTagName('title')[0]?.innerText || 'Laravel';

createInertiaApp({
    title: (title) => `${title} - ${appName}`,
    resolve: (name) => resolvePageComponent(`./Pages/${name}.vue`, import.meta.glob('./Pages/**/*.vue')),
    setup({ el, App, props, plugin }) {
        const myApp =  createApp({ render: () => h(App, props) })
            .use(plugin)
            .use(ZiggyVue, Ziggy)
            .use(i18nVue, {
                resolve: async lang => {
                    const langs = import.meta.glob('../../lang/*.json');
                    if (typeof langs[`../../lang/${lang}.json`] == "undefined") return; //Temporary workaround
                    return await langs[`../../lang/${lang}.json`]();
                }
            });
        myApp.config.globalProperties.__ = trans;
        myApp.mount(el);
    },
    progress: {
        color: '#4B5563',
    },
});

[xiCO2k]

Good case, will debug that.

[xiCO2k]

Hey @Jacobtims just tried and did not found any bug.

Check this repo: https://github.com/xiCO2k/laravel-vue-i18n-app