diff --git a/client/components/forms/BarcodeInput.vue b/client/components/forms/BarcodeInput.vue
index f283459e..a7f1414e 100644
--- a/client/components/forms/BarcodeInput.vue
+++ b/client/components/forms/BarcodeInput.vue
@@ -8,12 +8,14 @@
       v-if="isScanning"
       class="relative w-full"
     >
+      <ClientOnly>
       <CameraUpload
         :is-barcode-mode="true"
         :decoders="decoders"
         @stop-webcam="stopScanning"
         @barcode-detected="handleBarcodeDetected"
       />
+      </ClientOnly>
     </div>
 
     <div
diff --git a/client/components/forms/FileInput.vue b/client/components/forms/FileInput.vue
index 9677bb02..004428a2 100644
--- a/client/components/forms/FileInput.vue
+++ b/client/components/forms/FileInput.vue
@@ -10,12 +10,14 @@
         theme.fileInput.minHeight
       ]"
     >
-      <camera-upload
+      <ClientOnly>
+      <CameraUpload
         v-if="cameraUpload"
         :theme="theme"
         @upload-image="cameraFileUpload"
         @stop-webcam="isInWebcam=false"
       />
+      </ClientOnly>
     </div>
     <div
       v-else
diff --git a/client/nuxt.config.ts b/client/nuxt.config.ts
index b6eec302..cc31b9d4 100644
--- a/client/nuxt.config.ts
+++ b/client/nuxt.config.ts
@@ -22,7 +22,7 @@ export default defineNuxtConfig({
   ],
 
   build: {
-      transpile: ["vue-notion", "query-builder-vue-3", "vue-signature-pad"],
+      transpile: ["vue-notion", "query-builder-vue-3", "vue-signature-pad", "@zxing/library"],
   },
 
   i18n: {