Take photos with Ionic React - Capacitor

Dear.

I am dabbling in cross-platform development with Ionic React and Capacitor. What I am seeing is how to take and capture images with the device’s camera and save them in the gallery, for this purpose, I follow the following tutorial.

1- I created a new file: src/components/usePhotoGallery.tsx

2- In the file usePhotoGallery.tsx:

import { useState, useEffect } from "react";
import { useCamera } from '@ionic/react-hooks/camera';
import { useFilesystem, base64FromPath } from '@ionic/react-hooks/filesystem';
import { useStorage } from '@ionic/react-hooks/storage';
import { isPlatform } from '@ionic/react';
import { CameraResultType, CameraSource, CameraPhoto, Capacitor, FilesystemDirectory } from "@capacitor/core";


export function usePhotoGallery() {

    const { getPhoto } = useCamera();
  
    const takePhoto = async () => {
      const cameraPhoto = await getPhoto({
        resultType: CameraResultType.Uri,
        source: CameraSource.Camera,
        quality: 100
      });
    };
  
    return {
      takePhoto
    };
  }

This are the error that VSC show me:

Cannot find module '@ionic/react-hooks/camera' or its corresponding type declarations.ts(2307)

and

All imports in import declaration are unused.ts(6192)

Cannot find module ‘@ionic/react-hooks/filesystem’ or its corresponding type declarations.ts(2307)

and this laste one

‘useStorage’ is declared but its value is never read.ts(6133)

Cannot find module ‘@ionic/react-hooks/storage’ or its corresponding type declarations.ts(2307)

How can I fix it? Could you please help me?

1 post - 1 participant

Read full topic