如何使用Node.js的docx库设置表格单元格宽度？

问题原因 #

你遇到的宽度不生效问题，核心是docx库默认的表格布局为自动布局（AUTOMATIC），这种模式下单元格宽度会根据内容自动调整，手动设置的百分比或固定宽度会被忽略。

解决方案 #

要实现需求，需要做两个关键修改：

1. 将表格的布局模式改为固定布局（FIXED），强制应用手动设置的宽度规则；
2. 左侧单元格使用固定宽度（与图片宽度匹配），右侧单元格设置为100%宽度以占据剩余空间。

修改后的代码 #

const { ImageRun, Table, TableRow, TableCell, Paragraph, TextRun, WidthType, LayoutType } = require('docx');
const fs = require('fs');

const headerImage = new ImageRun({
    type: 'png',
    data: fs.readFileSync("./public/assets/images/test-image.png"),
    transformation: {
        width: 120,
        height: 120,
    },
});

const heading = new Table({
    width: {
        size: 100,
        type: WidthType.PERCENTAGE,
    },
    // 关键：设置表格为固定布局
    layout: LayoutType.FIXED,
    rows: [
        new TableRow({
            children: [
                new TableCell({
                    // 图片宽度120px，转换为docx的twip单位（1px≈15twip）
                    width: {
                        size: 120 * 15,
                        type: WidthType.TWIP
                    },
                    verticalAlign: "center",
                    children: [
                        new Paragraph({
                            children: [headerImage]
                        })
                    ],
                }),
                new TableCell({
                    // 占据剩余全部宽度
                    width: {
                        size: 100,
                        type: WidthType.PERCENTAGE
                    },
                    verticalAlign: "center",
                    children: [
                        new Paragraph({
                            alignment: "center",
                            children: [
                                new TextRun({
                                    text: "Text1",
                                    bold: true,
                                    size: "30pt",
                                }),
                                new TextRun({
                                    text: "Text2",
                                    italics: true,
                                    bold: true,
                                    size: "10pt",
                                    break: 1
                                }),
                                new TextRun({
                                    text: "Text3",
                                    size: "10pt",
                                    break: 1
                                }),
                                new TextRun({
                                    text: "TEXT4 ",
                                    size: "10pt",
                                    break: 1
                                }),
                                new TextRun({
                                    text: "Text5",
                                    underline: {},
                                    color: "0000FF",
                                })
                            ]
                        }),
                    ],
                }),
            ],
        }),
    ],
});

关键说明 #

• LayoutType.FIXED：开启固定布局后，表格会严格遵循设置的单元格宽度规则；
• 单位转换：docx使用twip作为宽度单位，1像素≈15twip，所以120px的图片对应1800twip的单元格宽度；
• 右侧单元格设为100%百分比：在固定布局下，这个设置会让单元格自动填充表格剩余的宽度空间。

内容的提问来源于stack exchange，提问作者Geeogee