I'm creating an application using Ionic Angular Capacitor, and I'm trying to upload images on the firebase storage. I got this code, but I guess it's using Cordova, and I'm using the new Capacitor.

chooseFile() {
    this.fileChooser.open().then((uri) => {
      alert(uri);

      this.file.resolveLocalFilesystemUrl(uri).then((newUrl) => {
        alert(JSON.stringify(newUrl));

        let dirPath = newUrl.nativeURL;
        let dirPathSegments = dirPath.split('/');
        dirPathSegments.pop();
        dirPath = dirPathSegments.join('/');

        this.file
          .readAsArrayBuffer(dirPath, newUrl.name)
          .then(async (buffer) => {
            await this.upload(buffer, newUrl.name);
          });
      });
    });
  }

  async upload(buffer, name) {
    let blob = new Blob([buffer], { type: 'image/*' });

    let storage = firebase.storage();

    storage
      .ref('images/' + name)
      .put(blob)
      .then((d) => {
        alert('Done');
      })
      .catch((error) => {
        alert(error);
      });
  }

Is there any way to fix it because it's giving me this error:

[WDS] Errors while compiling. Reload prevented.
errors @ index.js:150
(anonymous) @ socket.js:47
sock.onmessage @ SockJSClient.js:67
EventTarget.dispatchEvent @ sockjs.js:170
(anonymous) @ sockjs.js:891
SockJS._transportMessage @ sockjs.js:889
EventEmitter.emit @ sockjs.js:86
WebSocketTransport.ws.onmessage @ sockjs.js:2965
wrapFn @ zone.js:803
ZoneDelegate.invokeTask @ zone.js:434
Zone.runTask @ zone.js:205
ZoneTask.invokeTask @ zone.js:516
invokeTask @ zone.js:1656
globalZoneAwareCallback @ zone.js:1682
index.js:159 {moduleIdentifier: '/Users/clarkrouhana/Desktop/MobileProject/lareceta…. 
eta/src/app/pages/create-edit/create-edit.page.ts', moduleName: './src/app/pages/create-edit/create-edit.page.ts', loc: '9:0-39', message: 'Module not found: Error: Package path ./compat is …ject/lareceta/node_modules/firebase/package.json)'}