Create and download a pdf file on the cell phone

Question

I'm creating an application in ionic angular, but one requirement is to be able to create and save in the phone storage a pdf file. I'm using the pdfMake library, but it doesn't store the pdf file, it only shows me: Error: NO_DATA

These are my libraries and the function that creates the pdf:

In the case that I could not save the pdf using pdfmake, I would like to know what other library or other way I can get it to generate and also save it in the storage.

import { Component, OnInit } from '@angular/core';
import { ModalController, NavParams, LoadingController, ToastController } from '@ionic/angular';
import { FirebaseService } from '../../services/firebase.service';
import Chart from 'chart.js/auto';
import * as ExcelJS from 'exceljs';
import * as pdfMake from 'pdfmake/build/pdfmake';
import * as pdfFonts from 'pdfmake/build/vfs_fonts';
(pdfMake as any).vfs = pdfFonts.pdfMake.vfs;
import { Filesystem, Directory, Encoding } from '@capacitor/filesystem';

  async generatePdf() {
    let averageScore = (this.evaluation.totalScore / 86) * 100;

    let questionsTableBody: any[][] = [];
    this.questions.forEach((question: any) => {
      questionsTableBody.push([
        { text: question.name, fontSize: 8 },
        { text: question.text, fontSize: 8 },
        { text: question.score, fontSize: 8, alignment: 'center' }
      ]);
    });

    let racksTableBody: any[][] = [];
    this.racks.forEach((rack: any) => {
      racksTableBody.push([
        { text: rack.name, fontSize: 8 },
        { text: rack.text, fontSize: 8 },
        { text: rack.scoreFrame, fontSize: 8, alignment: 'center' },
        { text: rack.scoreBreams, fontSize: 8, alignment: 'center' },
        { text: rack.scoreDiagonals, fontSize: 8, alignment: 'center' }
      ]);
    });

    let rampsTableBody: any[][] = [];
    this.ramps.forEach((ramp: any) => {
      rampsTableBody.push([
        { text: ramp.name, fontSize: 8 },
        { text: ramp.text, fontSize: 8 },
        { text: ramp.scoreSurface, fontSize: 8, alignment: 'center' },
        { text: ramp.scoreEyebrow, fontSize: 8, alignment: 'center' },
        { text: ramp.scoreMechanism, fontSize: 8, alignment: 'center' }
      ]);
    });

    let images: any[][] = [];
    this.evaluation.photos.forEach((photo: any) => {
      images.push([{ image: photo.dataUrl, width: 100, alignment: 'center' }]);
    });

    let documentDefinition = {
     ... total design of my pdf
    }

    try {
      const pdfBlob = new Blob([JSON.stringify(documentDefinition)], { type: 'application/pdf' });
      const fileName = `Evaluacion_5s_${this.evaluation.evaluated}_${this.evaluation.date}.pdf`;
      const saveFile = await Filesystem.writeFile({
        path: fileName,
        data: pdfBlob,
        directory: Directory.Documents,
        recursive: true,
      });

      this.toastAlert('Exito', 'El archivo se guardó en ' + saveFile.uri);
    } catch (error) {
      this.toastAlert('Error', String(error));
    }
  }