Error: Can't find end of central directory : is this a zip file ? in React & docxtemplater

Viewed 399

I am facing an issue in using docxtemplater library to generate a doc file from my react application.

If anybody know how to solve this please help me.

import React from "react";
import Docxtemplater from "docxtemplater";
import PizZip from "pizzip";
import PizZipUtils from "pizzip/utils/index.js";
import { saveAs } from "file-saver";

import Sample from './sample.js';

function loadFile(url, callback) {
    PizZipUtils.getBinaryContent(url, callback);
}

function App(){
        //const generateDocument = () => {
        //    fetch("http://localhost:5000/api/doc")
        //        .then(res => console.log(res))
        //};

        const generateDocument = () => {
            loadFile("./assets/docs/newTemplate.docx",function (error, content) {
              if (error) {
                  throw error;
              }

              console.log(content);

              const zip = new PizZip(content);
              const doc = new Docxtemplater(zip, {
                  paragraphLoop: true,
                  linebreaks: true,
              });

              // render the document (replace all occurences of {first_name} by John, {last_name} by Doe, ...)
              doc.render({
                  client_name: "John",
              });
              const out = doc.getZip().generate({
                  type: "blob",
                  mimeType:
                      "application/vnd.openxmlformats-officedocument.wordprocessingml.document",
              }); //Output the document using Data-URI
              saveAs(out, "output.docx");
          }

            )};

        return (
            <div className="p-2">
                <button onClick={generateDocument}>
                    Generate document
                </button>
                <Sample></Sample>
            </div>
        );
};

export default App;

My template file is in assets/docs folder.

I tried various ways of using template in same folder & changing template with new templates but nothing worked. Please help me!

0 Answers
Related