diff --git a/front/.gitignore b/front/.gitignore
index 82c6435c..b7cc8c89 100644
--- a/front/.gitignore
+++ b/front/.gitignore
@@ -4,3 +4,4 @@ dist/
 /package-lock.json
 *.sh
 !templater.sh
+/public/iframe_api.js
diff --git a/front/Dockerfile b/front/Dockerfile
index 14914ebf..02bcba4c 100644
--- a/front/Dockerfile
+++ b/front/Dockerfile
@@ -12,7 +12,7 @@ RUN cp -r ../messages/ts-proto-generated/protos/* src/Messages/ts-proto-generate
 RUN sed -i 's/import { Observable } from "rxjs";/import type { Observable } from "rxjs";/g' src/Messages/ts-proto-generated/messages.ts
 RUN cp -r ../messages/JsonMessages/* src/Messages/JsonMessages
 
-RUN yarn install && yarn run typesafe-i18n && yarn build
+RUN yarn install && yarn run typesafe-i18n && yarn run build-iframe-api && yarn build
 
 # Removing the iframe.html file from the final image as this adds a XSS attack.
 # iframe.html is only in dev mode to circumvent a limitation
diff --git a/front/iframe-api.vite.config.ts b/front/iframe-api.vite.config.ts
new file mode 100644
index 00000000..3698647b
--- /dev/null
+++ b/front/iframe-api.vite.config.ts
@@ -0,0 +1,16 @@
+import { defineConfig } from "vite";
+import { resolve } from "path";
+
+export default defineConfig({
+    publicDir: false,
+    build: {
+        outDir: "public",
+        emptyOutDir: false,
+        lib: {
+            entry: resolve(__dirname, "src/iframe_api.ts"),
+            name: "iframe_api",
+            formats: ["cjs"],
+            fileName: () => "iframe_api.js",
+        },
+    },
+});
diff --git a/front/package.json b/front/package.json
index 227b0d86..8c81d8ca 100644
--- a/front/package.json
+++ b/front/package.json
@@ -74,10 +74,12 @@
     "zod": "^3.11.6"
   },
   "scripts": {
-    "start": "run-p templater serve svelte-check-watch typesafe-i18n",
+    "start": "run-p templater serve watch-iframe-api svelte-check-watch typesafe-i18n",
     "templater": "cross-env ./templater.sh",
     "serve": "cross-env vite --host",
     "build": "cross-env vite build",
+    "build-iframe-api": "vite --config iframe-api.vite.config.ts build",
+    "watch-iframe-api": "yarn run build-iframe-api --watch",
     "build-typings": "cross-env tsc --project tsconfig-for-iframe-api-typings.json",
     "test": "cross-env TS_NODE_PROJECT=\"tsconfig-for-jasmine.json\" ts-node node_modules/jasmine/bin/jasmine --config=jasmine.json",
     "lint": "node_modules/.bin/eslint src/ tests/ --ext .ts,.svelte",