reactjs - 错误：找不到中央目录的结尾：这是一个 zip 文件吗？在反应和 docxtemplater

Question

我在使用 docxtemplater 库从我的反应应用程序生成 doc 文件时遇到问题。

如果有人知道如何解决这个问题，请帮助我。

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;

我的模板文件在 assets/docs 文件夹中。

我尝试了各种在同一文件夹中使用模板并使用新模板更改模板的方法，但没有任何效果。请帮我！