离子本机相机插件导致应用程序无法正确呈现

Question

我正在尝试使用Ionic创建一个将使用相机插件的应用程序。目前，我在使相机插件正常工作方面遇到问题。当我在打字稿文件中输入摄像机的代码时，我的应用程序的某些部分完全停止渲染。但是，cmd在编译时不会显示任何错误。

我正在使用相机插件上Ionic文档中的代码，但不适用于我。我显然丢失了一些东西。

调用相机功能的HTML部分

  <ion-fab-button (click)="openCamera()" color="dark" icon-start>
    <ion-icon name="camera"></ion-icon>
  </ion-fab-button>

TypeScript函数

import { Component } from '@angular/core';
import { Camera, CameraOptions } from '@ionic-native/camera/ngx';


@Component({
  selector: 'app-tab1',
  templateUrl: 'tab1.page.html',
  styleUrls: ['tab1.page.scss']
})
export class Tab1Page {

  constructor(private camera: Camera) { }

  async openCamera(){

    const options: CameraOptions = {
      quality: 100,
      destinationType: this.camera.DestinationType.FILE_URI,
      encodingType: this.camera.EncodingType.JPEG,
      mediaType: this.camera.MediaType.PICTURE
    }

    this.camera.getPicture(options).then((imageData) => {
     // imageData is either a base64 encoded string or a file URI
     // If it's base64 (DATA_URL):
     let base64Image = 'data:image/jpeg;base64,' + imageData;
    }, (err) => {
     // Handle error
    });

  }

}