关于前端导出.docx文档遇到的问题

1.使用前端导出.docx文档需要使用到以下插件进行前端导出。

2.使用该插件可以进行封装js进行.docx模板导出，也可以单独一个组件进行引入导出，本人使用的js进行导出封装。

/*
* @param path data fileName
* path -- 为绝对路径'/' 
* -- 如vue-cli3项目需要把.docx模板存放在public目录下
* -- 如vue-cli2项目需要把.docx摹本存放在static目录下
* data -- 为模板中的字段只需要模板中的字段和导出的模板字端相同即可
* fileName -- 模板名字
*/
export function downloadWithTemplate(path, data, fileName) {
  JSZipUtils.getBinaryContent(path, (error, content) => {
    if (error) throw error;

    const zip = new PizZip(content);
    const doc = new Docxtemplater().loadZip(zip);
    doc.setData({
      ...data
    });

    try {
      doc.render();
    } catch (error) {
      const e = {
        message: error.message,
        name: error.name,
        stack: error.stack,
        properties: error.properties,
      };
      ElMessage.error("文件格式有误!");
      throw error;
    }
    const out = doc.getZip().generate({
      type: "blob",
      mimeType:
        "application/vnd.openxmlformats-officedocument.wordprocessingml.document",
    });
    saveAs(out, fileName);
  });
}

3.导出word模板遇到的错误can‘t find end of central directory:is this a zip file?

一般都是路径的问题，请确定路径是否写对路径只能为绝对路径'/'，如路径没有问题那排查一下是否在项目中使用mockjs，本人是没有使用到mockjs。

4.导出.docx模板出现在本地是可以的但是，前端打包完部署在进行导出就存在问题，有报404 和 can't find end of central directory:is this a zip file?

1 - 出现404这种问题，首先向后端询问ng是否映射出前端打包出的.docx文件路径

2 - 出现can't这种问题，然而后端也配有ng，这时候只拿后端配的ng,IP + 端口/拿这个路径就可以

以上是本人在进行前端导出.docx文档遇到的问题，希望能帮助到你们噢~