Docxtemplater：纯JS生成Word文档的航母式玩具

一、代码生成Word文档的新星

Docxtemplater，是一款纯JS生成Word文档的开源工具，它可以通过简单的代码，生成格式不乱的文档，解决了手动生成文档的烦恼。其技术框架是Node.js和AngularJS，经过对IO和AngularJS的慢性能进行分析，并在代码调整后进行测试，能够完美地解决模板克隆、图像插入、表格绑定、流程模板录入等诸多问题。

二、使用方法

1、首先下载：

npm install docxtemplater // 安装

const Docxtemplater = require('docxtemplater');
const fs = require('fs');
const path = require('path');
const PizZip = require('pizzip');
// ⚠️注意：需要安装 pizzip-utils，否则会出现「PizZip is not defined」的问题
const pizzipUtil = require('pizzip/utils');

const templateStr = fs.readFileSync(path.resolve(__dirname, './test.docx'), 'binary');
const template = new Docxtemplater(new PizZip(templateStr));

const body = {
  name: '李**',
  age: 24,
  address: '深圳市南山区xx路xx号'
}

template.setData(body);
template.render();
const result = template.getZip().generate({type: 'nodebuffer'});

fs.writeFileSync(path.resolve(__dirname, './result.docx'), result);

2、代码解析：

上面这段代码中，我们下载了docxtemplater，同时还需要把模板（test.docx）读成二进制文件。如：const templateStr = fs.readFileSync(path.resolve(\_\_dirname, './test.docx'), 'binary')。接着将模板放入docxtemplater中：const template = new Docxtemplater(new PizZip(templateStr));。如果有数据需要更改，可通过template.setData(body)方法来更改，最后执行渲染方法template.render()，并通过getZip().generate({type: 'nodebuffer'})来获取二进制文件。当数据及Word模板输入完成后，保存文件即可。

三、常见问题

1、中文乱码问题：

npm -g install mammoth
const mammoth = require('mammoth');
const html = fs.readFileSync('index.html', 'utf8');

mammoth.convertToHtml({ text: html }, {prettyPrint: true})
  .then((result) => {
    // 读取 Docx 模板并赋值以替换 {{ variable }} 代码块。不同的代码块用 {{# array }}...{{/ array }} 包裹
    const docx = fs.readFileSync('./template.docx', 'binary');
    template = new Docxtemplater();
    template.loadZip(new PizZip(docx));

    // 关键步骤：将 HTML 转换后的结果赋值给模板中的一个变量。此处注意：千万不要将如 test 这种包裹在唯一的  标签内
    template.setData({
      VARIABLE_NAME: result.value
    });

    // 对应模板中包含类似这样的 {{ VARIABLE_NAME }} 代码块，将其替换为上面所请求的数据
    const buff = template.getZip().generate({ type: 'nodebuffer' });
    fs.writeFileSync('test.docx', buff);
  })
  .done();

2、将图片插入到Word中：

const imageBuf = fs.readFileSync('test.png'); // 将图片二进制读入 Node.js 环境
const base64Img = `data:image/png;base64,${Buffer.from(imageBuf).toString('base64')}`; // 将图片的结果转换为Base64
doc.setData({ logo: base64Img }); // 将图片编码为base64并插入到文档中

3、使用SVGs

// 1. 转换 SVG 到 PNG
const Rsvg = require('librsvg').Rsvg;
const rsvg = new Rsvg(svgbuf);
const pngbuf = rsvg.render({
    format: 'png',
    width: dimensions.width,
    height: dimensions.height,
}).data;

// 2. 通过 Base64 数据插入到报告中
pngurl = 'data:image/png;base64,' + Buffer.from(pngbuf).toString('base64');
doc.setData({
    logo: pngurl,
});