fe/src/i18n/index.ts

@@ -1,11 +1,11 @@
-import en from './en.json'; // Changed from enUS and path
+import en from './en.json';
 import de from './de.json';
 import fr from './fr.json';
 import es from './es.json';
 
 export default {
-  'en': en, // Changed from 'en-US': enUS
+  en,
-  'de': de,
+  de,
-  'fr': fr,
+  fr,
-  'es': es
+  es
 };

fe/src/main.ts

@@ -5,7 +5,10 @@ import { BrowserTracing } from '@sentry/tracing';
 import App from './App.vue';
 import router from './router';
 import { createI18n } from 'vue-i18n';
-import messages from '@/i18n';
+import enMessages from './i18n/en.json'; // Import en.json directly
+import deMessages from './i18n/de.json';
+import frMessages from './i18n/fr.json';
+import esMessages from './i18n/es.json';
 
 // Global styles
 import './assets/main.scss';
@@ -26,10 +29,15 @@ import { useAuthStore } from '@/stores/auth';
 // //   export interface DefineNumberFormat {}
 // // }
 const i18n = createI18n({
-  legacy: false, // Recommended for Vue 3
+    legacy: false, // Recommended for Vue 3
-  locale: 'en', // Default locale
+    locale: 'en', // Default locale
-  fallbackLocale: 'en', // Fallback locale
+    fallbackLocale: 'en', // Fallback locale
-  messages,
+    messages: {
+        en: enMessages,
+        de: deMessages,
+        fr: frMessages,
+        es: esMessages,
+    },
 });
 
 const app = createApp(App);

fe/src/pages/LoginPage.vue

@@ -57,8 +57,16 @@ const router = useRouter();
 const route = useRoute();
 const authStore = useAuthStore();
 const notificationStore = useNotificationStore();
+const { t, locale, messages } = useI18n();
 
-const { t } = useI18n();
+// Debug output
+console.log('=== i18n Debug Info ===');
+console.log('Current locale:', locale.value);
+console.log('Available messages:', messages.value);
+console.log('English messages:', messages.value.en);
+console.log('LoginPage messages:', messages.value.en?.loginPage);
+console.log('Test translation:', t('loginPage.emailLabel'));
+console.log('Test fallback:', t('message.hello'));
 
 const email = ref('');
 const password = ref('');

fe/vite.config.ts

@@ -44,7 +44,7 @@ const pwaOptions: Partial<VitePWAOptions> = {
       'dev-sw.js',
       'index.html',
     ],
-    maximumFileSizeToCacheInBytes: 5 * 1024 * 1024, // 5MB
+    maximumFileSizeToCacheInBytes: 15 * 1024 * 1024, // 5MB
   },
   workbox: {
     cleanupOutdatedCaches: true,
@@ -57,9 +57,10 @@ export default defineConfig({
     vue(),
     VitePWA(pwaOptions),
     VueI18nPlugin({
-      include: [path.resolve(path.dirname(fileURLToPath(import.meta.url)), './src/i18n/**')],
+      include: [path.resolve(path.dirname(fileURLToPath(import.meta.url)), './src/i18n/**.json')],
       strictMessage: false,
       runtimeOnly: false,
+      compositionOnly: false,
     }),
   ],
   resolve: {