How to use capacitor camera preview in a Vue.js app?

Question

I have a Vue.js app and I want to use capacitor camera preview plugin. But when I run the app on web I get this error on the console Also it does not work in IOS as well.

Here is the documentation of the plugin https://github.com/capacitor-community/camera-preview#readme

Here is my component

<template>
  <div>
    
  </div>
</template>

<script>
import '@capacitor-community/camera-preview'
import { CameraPreview } from '@capacitor-community/camera-preview';

const cameraPreviewOptions = {
  position: 'rear',
  height: 1920,
  width: 1080
};

export default {
  created() {
    CameraPreview.start(cameraPreviewOptions);
  }
}
</script>

Answer 1

I added id="cameraPreview" and my problem is fixed

<template>
  <div id="cameraPreview">
    
  </div>
</template>