feat(frontend): i18n en vertalingsbestanden initialisatie

frontend/src/i18n/i18n.ts

@@ -0,0 +1,21 @@
+import { createI18n } from "vue-i18n";
+
+// Import translations
+import en from "@/i18n/locales/en.json";
+import nl from "@/i18n/locales/nl.json";
+import fr from "@/i18n/locales/fr.json";
+import de from "@/i18n/locales/de.json";
+
+const i18n = createI18n({
+    //legacy: false,
+    locale: "en",
+    fallbackLocale: "en",
+    messages: {
+        en: { ...en },
+        nl: { ...nl },
+        fr: { ...fr },
+        de: { ...de },
+    },
+});
+
+export default i18n;

frontend/src/main.ts

@@ -1,15 +1,17 @@
-import { createApp } from "vue";
+import {createApp} from "vue";
 
 // Vuetify
 import "vuetify/styles";
-import { createVuetify } from "vuetify";
+import {createVuetify} from "vuetify";
 import * as components from "vuetify/components";
 import * as directives from "vuetify/directives";
+import i18n from "./i18n/i18n.ts";
 
 // Components
 import App from "./App.vue";
 import router from "./router";
 
+
 const app = createApp(App);
 
 app.use(router);
@@ -24,5 +26,5 @@ const vuetify = createVuetify({
     directives,
 });
 app.use(vuetify);
-
+app.use(i18n);
 app.mount("#app");

tsconfig.json

@@ -118,7 +118,8 @@
 
         /* Completeness */
         // "skipDefaultLibCheck": true,                      /* Skip type checking .d.ts files that are included with TypeScript. */
-        "skipLibCheck": true
+        "skipLibCheck": true,
         /* Skip type checking all .d.ts files. */
+        "resolveJsonModule": true
     }
 }