docxjs是一款较为强大的docx格式文档处理的js库,基本可以处理我们遇到的所有有关于docx的文档问题。支持内置方式的word生成、解析、格式渲染。除此之外,我们还可以通过自定义方式直接通过xml方式渲染word包括但不限于字体样式、字体大小、段落样式、间距、颜色等一系列我们可能遇到的问题,下面我就把docxjs如何使用简单整理下,喜欢的朋友,帮忙点个广告支持小编,创作不易。
安装
$npm install --save docx // 或者 $yarn add docx -D
基础使用
import * as fs from "fs"; import { Document, Packer, Paragraph, TextRun } from "docx"; // 文档由章节数组[sections]组成 // 这里示例只是创建了一个章节 const doc = new Document({ sections: [ { properties: {}, children: [ new Paragraph({ children: [ new TextRun("Hello World"), new TextRun({ text: "Foo Bar", bold: true, }), new TextRun({ text: "\tGithub is the best", bold: true, }), ], }), ], }, ], }); // Used to export the file into a .docx file Packer.toBuffer(doc).then((buffer) => { fs.writeFileSync("My Document.docx", buffer); }); // Done! My Document.docx文件就创建好了
docxjs中的基本概念
Document
Document是word文档的顶级对象,是最后生成.docx的最终封装类。您可以将所有的Paragraphs 添加到Document中,注意,一个.docx文档只有一个Document对象。
如何创建一个Document对象?
const doc = new docx.Document();
文档属性
您可以通过指定选项将属性添加到 Word 文档,例如:
const doc = new docx.Document({ creator: "Dolan Miu", description: "My extremely interesting document", title: "My Document", });
Document 配置属性
- creator
- description
- title
- subject
- keywords
- lastModifiedBy
- revision
- externalStyles
- styles
- numbering
- footnotes
- hyperlinks
- background
如何使用配置项?
我们可以看下通过修改配置项实现改变document背景色的示例来了解下:
const doc = new docx.Document({ background: { color: "C45911", }, });
Sections
每一个文档都是由多一个或者多个Sections构成的。一个Section是一组具有一组特定属性的Paragraphs ,这些属性用于定义将出现文本的页面。属性包括页面大小、页码、页面方向、页眉、边框和边距。例如,您可以有一个带有页眉和页脚的纵向部分,另一个没有页脚的横向部分,以及一个显示当前页码的页眉。
示例
const doc = new Document({ sections: [{ children: [ new Paragraph({ children: [new TextRun("Hello World")], }), ], }]; });
Section Type
设置节类型决定了节的内容相对于前一节的放置方式。例如,有五种不同的类型:
- CONTINUOUS
- EVEN_PAGE
- NEXT_COLUMN
- NEXT_PAGE
- ODD_PAGE
const doc = new Document({ sections: [{ properties: { type: SectionType.CONTINUOUS, } children: [ new Paragraph({ children: [new TextRun("Hello World")], }), ], }]; });
Paragraph
docx文件中OpenXML 中的所有内容(文本、图像、图表等)都按段落组织。Paragraphs 需要对Sections的理解。
创建
import { Paragraph } from "docx"; const paragraph = new Paragraph("Short hand Hello World");
创建子组件
const paragraph = new Paragraph({ children: [new TextRun("Lorem Ipsum Foo Bar"), new TextRun("Hello World"), new SymbolRun("F071")], });
直接创建
const paragraph = new Paragraph({ text: "Short hand notation for adding text.", });
创建paragraph后需要将它添加到section上.
const doc = new Document({ sections: [{ children: [paragraph], }]; });
选项
这是段落的选项列表。详细解释如下:
Property | 类型 | 强制的? | 值集 |
---|---|---|---|
text | string |
可选的 | |
heading | HeadingLevel |
可选的 | HEADING_1 , HEADING_2 , HEADING_3 , HEADING_4 , HEADING_5 , HEADING_6 ,TITLE |
border | IBorderOptions |
可选的 | top , bottom , left , right . 其中每一个都是 IBorderPropertyOptions 类型。单击此处查看示例 |
spacing | ISpacingProperties |
可选的 | 请参阅下面的 ISpacingProperties |
outlineLevel | number |
可选的 | |
alignment | AlignmentType |
可选的 | |
heading | HeadingLevel |
可选的 | |
bidirectional | boolean |
可选的 | |
thematicBreak | boolean |
可选的 | |
pageBreakBefore | boolean |
可选的 | |
contextualSpacing | boolean |
可选的 | |
indent | IIndentAttributesProperties |
可选的 | |
keepLines | boolean |
可选的 | |
keepNext | boolean |
可选的 | |
children | (TextRun or ImageRun or Hyperlink)[] |
可选的 | |
style | string |
可选的 | |
tabStop | { left?: ITabStopOptions; right?: ITabStopOptions; maxRight?: { leader: LeaderType; }; center?: ITabStopOptions } |
可选的 | |
bullet | { level: number } |
可选的 | |
numbering | { num: ConcreteNumbering; level: number; custom?: boolean } |
可选的 | |
widowControl | boolean |
可选的 | |
frame | IFrameOptions |
可选的 |
文本
const paragraph = new Paragraph({ text: "Hello World", });
标题
将标题 1 段落设置为“Hello World”作为文本:
const paragraph = new Paragraph({ text: "Hello World", heading: HeadingLevel.HEADING_1, });
Border
使用IBorderPropertyOptions给Paragraph添加边框配置
top
, bottom
, left
, right
of the border
Property | Type | Notes |
---|---|---|
color | string |
Required |
space | number |
Required |
style | string |
Required |
size | number |
Required |
const paragraph = new Paragraph({ text: "I have borders on my top and bottom sides!", border: { top: { color: "auto", space: 1, style: "single", size: 6, }, bottom: { color: "auto", space: 1, style: "single", size: 6, }, }, });
Shading
为整个段落块添加颜色
const paragraph = new Paragraph({ text: "shading", shading: { type: ShadingType.REVERSE_DIAGONAL_STRIPE, color: "00FFFF", fill: "FF0000", }, });
Widow Control
允许第一行/最后一行显示在单独的页面上
const paragraph = new Paragraph({ text: "shading", widowControl: true, });
Spacing
通过ISpacingProperties配置Spacing属性
Property | Type | Notes | Possible Values |
---|---|---|---|
after | number |
Optional | |
before | number |
Optional | |
line | number |
Optional | |
lineRule | LineRuleType |
Optional | AT_LEAST , EXACTLY , AUTO |
const paragraph = new Paragraph({ text: "Paragraph with spacing before", spacing: { before: 200, }, });
Outline Level
const paragraph = new Paragraph({ outlineLevel: 0, });
更多详细配置请参考:paragraph:https://docx.js.org/#/usage/paragraph
建议参照mircsoft提供的docx规范进行参照学习: 开发 Office 解决方案