dolanmiu / docx

Easily generate and modify .docx files with JS/TS with a nice declarative API. Works for Node and on the Browser.

Easily generate and modify .docx files with JS/TS. Works for Node and on the Browser.

---

Demo

Browser

Here are examples of docx being used with basic HTML/JS in a browser environment:

• https://codepen.io/dolanmiu/pen/RwNeObg
• https://jsfiddle.net/dolanmiu/onadx1gu/

Here are examples of docx working in Angular:

• https://stackblitz.com/edit/angular-docx
• https://stackblitz.com/edit/angular-wmd6k3

Here are examples of docx working in React:

• https://stackblitz.com/edit/react-docx
• https://stackblitz.com/edit/react-docx-images (adding images to Word Document)

Here is an example of docx working in Vue.js:

• https://stackblitz.com/edit/vuejs-docx

Node

Press endpoint on the RunKit website:

• https://runkit.com/dolanmiu/docx-demo1 - Simple paragraph and text
• https://runkit.com/dolanmiu/docx-demo2 - Advanced Paragraphs and text
• https://runkit.com/dolanmiu/docx-demo3 - Bullet points
• https://runkit.com/dolanmiu/docx-demo4 - Simple table
• https://runkit.com/dolanmiu/docx-demo5 - Images
• https://runkit.com/dolanmiu/docx-demo6 - Margins
• https://runkit.com/dolanmiu/docx-demo7 - Landscape
• https://runkit.com/dolanmiu/docx-demo8 - Header and Footer
• https://runkit.com/dolanmiu/docx-demo10 - My CV generated with docx

More here

How to use & Documentation

Please refer to the documentation at https://docx.js.org/ for details on how to use this library, examples and much more!

Examples

Check the demo folder for examples.

Contributing

Read the contribution guidelines here.

Used by

...and many more!

---

Made with 💖

docx's Issues

Missing tab interfaces

In the wiki (specifically here https://github.com/dolanmiu/docx/wiki/Tab-Stops) it says there is a centerTabStop (spelled wrong in the wiki BTW) and a rightTabStop method. These do not exist. They should be added to the Paragraph and ParagraphStyle classes.

header2 references in header-wrapper need to be removed.

In the header-wrapper file there are two classes, FirstPageHeaderWrapper and HeaderWrapper. I added a "header2" property to the HeaderWrapper class that should be removed. There is also a "get Header2() method that should be removed. I added those when I was testing ways to add the "differentFirstPageHeader" feature but they are not used. I forgot the clean that up before merging.

Sorry about that!

Header Reference in document.xml

Hello @dolanmiu

First of all I would like to say, that your module is superb, you've done really, really good job! I like the idea of collecting parts of docx into one.I was able to do almost all customization without changing a single line of .js/.ts code. Modifications were done by chaning/adding xml files:

template/[Content_Types].xml - added lines:

<Override PartName="/word/media/image1.png" ContentType="image/png"/> <Override PartName="/word/header1.xml" ContentType="application/vnd.openxmlformats-officedocument.wordprocessingml.header+xml"/>

template/word/document.xml.rels - added lines:

<Relationship Id="rId3" Type="http://schemas.openxmlformats.org/officeDocument/2006/relationships/header" Target="header1.xml"/>

and adding files:

template/media/image1.png
template/word/header1.xml (i took file contents from file generated by libreoffice writer file with header with image).

However, there is still one part which i wasn't able to do by modification of xml files, due document.xml is creating in a fly. The thing i am trying to achieve is adding a section with header reference into the body tag, to be exact right before closing the body tag:

<w:sectPr><w:headerReference w:type="default" r:id="rId3"/><w:type w:val="nextPage"/><w:pgSz w:w="11906" w:h="16838"/><w:pgMar w:left="1134" w:right="1134" w:header="1134" w:top="1693" w:footer="0" w:bottom="1134" w:gutter="0"/><w:pgNumType w:fmt="decimal"/><w:formProt w:val="false"/><w:textDirection w:val="lrTb"/></w:sectPr>

I tested it, by adding manually this piece of code into document.xml file in file I generated by using Your module, and that did the trick.

I am also aware that this is hackish style of solving that problem, so maybe there is other, more beautiful way to achieve it?

I attached document where all modifications are included. My Document.docx

Thank you!

Local packer closing write stream prematurely

Running the example in the docs results in an empty file being created. The issue is the local packer closing the file stream synchronously, instead of letting archiver close it itself. The following fixes the issue:

diff --git a/ts/export/packer/local.ts b/ts/export/packer/local.ts
index afdf1c5..17693bb 100644
--- a/ts/export/packer/local.ts
+++ b/ts/export/packer/local.ts
@@ -14,6 +14,5 @@ export class LocalPacker extends Packer {
     pack(path: string): void {
         this.stream = fs.createWriteStream(path);
         super.pack(this.stream);
-        this.stream.close();
     }

PS: I'm happy to submit PRs for all of this stuff if you'll accept them :)

Landscape

Hi again !
Is it possible to put a page in landscape orientation ?
Thanks !

TypeError: Cannot read property 'prototype' of undefined when trying to use docx on Ionic3

TypeError: Cannot read property 'prototype' of undefined when trying to use docx on Ionic3

import * as docx from 'docx';
let doc: any = new docx.Document();

can i read docx/doc from nodejs

hello, i want to ask a relative question.I hava a project to do recently,and i need to transform a doc/docx document to a html.I search a lot through google and it seem the only way is using unoconv.i want to know whether there is another method? bad english(QAQ) and i hope you can read it

RangeError when creating an image

I'm trying to add an image (that I can correctly open with other tools), using a simple document.createImage('./cover.jpg');. But I get:

RangeError: Index out of range
    at checkOffset (buffer.js:970:11)
    at Buffer.readUInt16LE (buffer.js:1016:5)
    at Object.isCUR [as detect] (/Users/gawaine/dev/artshell-docx-exporter/node_modules/docx/build/index.js:47491:14)
    at module.exports (/Users/gawaine/dev/artshell-docx-exporter/node_modules/docx/build/index.js:48009:33)
    at lookup (/Users/gawaine/dev/artshell-docx-exporter/node_modules/docx/build/index.js:47349:14)
    at module.exports (/Users/gawaine/dev/artshell-docx-exporter/node_modules/docx/build/index.js:47449:12)
    at Media.addMedia (/Users/gawaine/dev/artshell-docx-exporter/node_modules/docx/build/index.js:47292:28)
    at File.createImage (/Users/gawaine/dev/artshell-docx-exporter/node_modules/docx/build/index.js:46088:38)
    at createDocument (/Users/gawaine/dev/artshell-docx-exporter/index.js:43:26)
    at <anonymous>
    at process._tickCallback (internal/process/next_tick.js:188:7)

Image from Data URI base64

Sorry if this was already asked, I didn't find anything about it in the Docs.
As of right now, I can pass the directory path of an image and it works fine but data URIs don't seem to work, is it possible to do it with some other method?

Get rid of clearVariables and allow object reuse

So I think I understand clearVariable and the Formatter much better now, and have an idea for how to proceed. Let me first lay out what I think these are doing and why to make sure what I'm suggesting makes sense.

1. Ultimately, the point of the Formatter is to convert the docx objects into something that xml, with its wonky format, can understand.
2. The Packer is the only entity responsible for calling the Formatter, and the Formatter in turn calls clearVariables
3. The reason to have this separate formatting step is that xml's format is otherwise unwieldy to use as the structures are built up.

The current approach works, but has a few shortcomings:

• Existing objects are rendered unstable after clearVariables has been called on them. This is causing me particular trouble, since it means I have to re-create all styles, numbering and properties from scratch for every document I render
• All classes that use custom fields must define clearVariables and take care to call their children's clearVariables.
  • This makes it tricky to define new classes/fields, and can easily lead to bugs that won't be caught until cross-checked with Word
  • The variable clearing logic is scattered all over the place
• The formatter performs a number of steps, including JSON.parse(JSON.stringify(...)), and has to traverse the entire structure (slow and memory intensive)

---

If you agree with me this far, let me know what you think of the following. Right now, there are basically three families of components, all inheriting from BaseXml:

• XmlComponent: This is the most common parent class, and it serializes to an XML tag
• XmlAttributeComponent: This is also quite common, it serializes to the attributes on a tag. It's thus commong for XmlComponent classes to have an associated XmlAttributeComponent
• XmlUnit: This class is another way of representing attributes on a tag. Unlike XmlAttributeComponent, Each instance represents one attribute. It's currently only used for the top-level properties (Title, Subject, etc.)

I'm working on a patch that will:

• Combine XmlUnit and XmlComponent into one class that can take either strings or child components as children

• Make XmlComponent into a generic class, parametrized by the class of attributes it uses, which are now always stored in its .attrs field. E.g., Paragraph would now be defined as:

  export class Paragraph extends XmlComponent<ParagraphProperties> { ... }

• Simplify the Formatter, using the fact that all BaseXml instances are either an XmlComponent or one of their .attrs. This is the magic step, and actually becomes quite easy once the other two are done. Basically, instead of mutating the XmlComponent into the xml format, the Formatter will create a new object using the data from the component but a brand top-level structure. Since we're already round-tripping through JSON, this new approach will be more efficient, since there will be structures we can re-use (e.g., the array of child elements, .root). And it also avoids having to remove extraneous fields from XmlComponent

I should have a PR in the next hour or so, but wanted to give you a heads up of what was coming!

push vs. add

Let's standardize on having the methods be called add. Fixing this would be a breaking change, so would have to bump the library to 2.X.

Add screenshot to wiki

I may be doing this wrong, but I'm trying to save this screenshot to the wiki and failing. It is the result of running the example program there:

Images Support

Need to think of a way to embed images into the word document

docx + Angular2

Trying to get it working with Angular2 for a docx demo, but I get the following issue:

I believe its a fault within the archiver npm module which uses grateful-fs

isaacs/node-graceful-fs#109

Maybe it is simply not possible to do this on the client side and it must be on a node instance

addRun, not addText

Hi guys,
i was testing your system today (really cool by the way!), and I found an inconsistency between what worked for me and your docs (maybe my fault, who knows)

i had to use the following code here:
var docx_para = new docx.Paragraph();
text = new docx.TextRun("whatever");
docx_para.addRun(text);

instead of what's in the docs:

var docx_para = new docx.Paragraph();
text = new docx.TextRun("whatever");
docx_para.addText(text);

my docx package is version 3.0.1

thanks again!

can this library be used to open existing docx files and save them as pdf?

Not downloading with GET request

What I am trying to acocomplish is the same as you have in your website, the user clicks a button, which accesses the endpoint, generates and downloads the DOCX.
When I access the endpoint directly from the route ("localhost:3000/api"), the DOC is generated as expected, but when I make an AJAX get request to the endpoint, the messages are logged to the console but the DOC is not generated/downloaded.
This is the code for the endpoint:

app.get("/api", (req, res) => {

    var doc = new docx.Document();
    const table = doc.createTable(4, 4);
    table.getCell(2, 2).addContent(new docx.Paragraph('Hello'));
    const expressPacker = new docx.ExpressPacker(doc, res);
    expressPacker.pack("Document");
    console.log("ENDPOINT REACHED");

});

And this is the code for the AJAX request using jQuery:

<script>
    $('button').click(() => {
        $.get("http://localhost:3000/api", (data) => {
            console.log("works");
        });
    });
</script>

I imagine it is some kind of problem due to conflits with the express response object, but I am not so sure.
I am using:
docx: 3.4.0
express: 4.16.3
Running on Windows 10, using Chrome.

Any ideas on what could be the problem?

table - set border width, style, color

Excellent library!

Is this possible to set those attributes for the whole table (or individual cells)?

I haven't found anything in the demos, but in library source code, those attributes are handled but only as defaults. I wonder if I could change them after table creation. And if yes, then how?

Page margins

Hello and thank you very much for your great library!

I'm integrating it in my project (www.bibisco.com).

I have a question: how can I programmatically set page margins? Could you provide an example?

Thank you!

table cell with image

Thanks for your helpful lib,

I wanna know is it possible to embedded image to table cell like as follow:

const table = doc.createTable(4, 4);
table.getCell(2, 2).addContent(doc.createImage('./test.png'));

NPM package does not include build files

This package is exactly what I was looking for! Apologies that I'm about to file a handful of little issues.

If I npm install this package, I only get the typescript files. Not sure what your process is for releasing, for some reason the build directory is not included in the NPM package. Node complains of not finding docx

Is page break implemented correctly?

The implementation of paragraph.pageBreak() has it add a <w:br w:type="page"/> element to the w:pPr element of the paragraph. Looking at the spec, I could only find w:br under "17.3.3 Run Content", which is implemented as Run#break.

If my reading is correct, I think we should remove this method and add it to Run

Empty file created.

I am a first time user of docx.

I am using the simple usage example to create a docx fie.
Everything seems to run fine, no errors and the document is created, however it is empty.

I have also tried to create a pdf using the same example code, but no file is created.

Any idea whats going on

OS: Mint
Node: 8.10.0

Section breaks

Would it be possible to add support for section breaks?

Thematic breaks allow you to add a break within a page much like a section break, but proper section allows them to be further styled in word within Page Setup.

Incorrect docx format in electron

Hi,
Thank you for this library.

I am using docx in an electron application.
It works great when run with electron directly but seems to create an unreadable docx file when run after packaging the app using electron-packager.
The file is created and has content but it cannot be read by any docx file readers.
Any idea why this might be happening ?

For instance, these two files contain the same content, the letter 'd', but still seem to differ
Before packaging
After packaging

Images are running out of the page

The images that I am adding are running out of the page. I tried setting margins on the page, but it doesn't work to set the images to fit in the page.
Is there a way to set width and height to the image? I tried doing this -

arrboth.forEach(function(item){ const image = doc.createImage(item.image); image.properties.width = 900; image.properties.height = 900; doc.createParagraph(item.comment).style('normalPara2'); })
But it gives an error in terminal saying "Cannot set properties of undefined"
So, how can I set width and height of images to fit in the page?

Standardized formatting methods

Right now there are multiple places where formatting methods (like .bold() or .font()) can be called, and we're not consistent in the ones we support. There are a few things we have to do:

• Document the complete list of formatting methods available
  • Run-level (e.g., bold)
  • Paragraph-level (e.g., indent)
  • Table-level (e.g., layout algorithm)
• Ensure they can be consistently applied in relevant contexts
  • In-line runs (run-level)
  • In-line paragraphs (run-level + paragraph)
  • In-line tables (run-level + paragraph + table)
  • Run named styles (run-level)
  • Paragraph named styles (run + paragraph)
  • Table named styles (all three)
  • Numbering styles (all three)
    • Run methods
    • Paragraph methods
    • Table methods

Documentation site is down

Awesome project.
I noticed that the documentation site listed isn't working.
http://dolanmiu.github.io/docx

How do I make a table where the cells are sized to the margin?

For example, I want to make a 4x4 table, and I want those 4x4 cells to be scaled to the size allowed by the margins, how do I do that?

Thanks.

How to add an image from a buffer into a document?

Hello,

I'm using [email protected].

The code below returns doc.createDrawing is not a function :

const doc = new docx.Document();
const paragraph = new docx.Paragraph('Some text.');
paragraph.addRun(new docx.TextRun('Some text run.'));
doc.addParagraph(paragraph);
const buff = fs.readFileSync('/tmp/w3c_home.png');
const image_data = doc.createImageData('Dummy dummy', buff);
doc.createDrawing(image_data);

What am I doing wrong?

Lodash type definitions incompatible with latest typescript

I hit this issue with the lodash type definitions, so had to manually edit ts/typings/lodash/lodash.d.ts to comment out the bottom line. I don't really use typescript/know what I'm doing, but this made the build work

diff --git a/ts/typings/lodash/lodash.d.ts b/ts/typings/lodash/lodash.d.ts
index 7901073..6d0e85d 100644
--- a/ts/typings/lodash/lodash.d.ts
+++ b/ts/typings/lodash/lodash.d.ts
@@ -19169,4 +19169,4 @@ declare module "lodash" {
 interface Set<T> {}
 interface Map<K, V> {}
 interface WeakSet<T> {}
-interface WeakMap<K, V> {}
+// interface WeakMap<K, V> {}

any variable in packer

in this line:

https://github.com/dolanmiu/docx/blob/master/ts/export/packer/local.ts#L11

Can it be the Styles class?

catching errors with exporter.pack

Hi again!
I looked around the wiki and tested with this:
try {
exporter.pack(path.join(file_path, title));
} catch(e) {
console.log(e);
}

and

exporter.pack(path.join(file_path, title), err => {
if (err) {
console.log(err);
}
});
so, heres the thing... if writing the file doesn't work for some reason (e.g.. Uncaught Error: EISDIR: illegal operation on a directory, open), Is there any way to catch the error?
thanks again!!!!

Capitalization typo in tests

There was a small typo in one of the tests. This was what Travis complained about in the last build:

--- a/ts/tests/export/formatterTest.ts
+++ b/ts/tests/export/formatterTest.ts
@@ -2,7 +2,7 @@
 /// <reference path="../../typings/lodash/lodash.d.ts" />
 /// <reference path="../../typings/chai/chai.d.ts" />
 
-import {Formatter} from "../../export/Formatter";
+import {Formatter} from "../../export/formatter";
 import * as docx from "../../docx";
 import {Attributes} from "../../docx/xml-components";
 import {Properties} from "../../properties";
@@ -77,4 +77,4 @@ describe("Formatter", () => {
             assert.isDefined(newJson["cp:coreProperties"]);
         });
     });

Different First Page Header **Question**

Hello,

When creating word documents with Word or Google Docs, there is a "Different First Page" header option. Can this functionality be recreated in this package?

Thanks!

Is this made to work on a browser?

Only found Express references, but I'm wondering if this can work on a web browser. I read a browser exporter is in progress but is it currently possible to use it in a web browser and just get the binary output from the document ?

Table support

Hey @dolanmiu -- I've started working on a table implementation for docx. You can see the initial work at felipeochoa/docx@04c489fed798cf. If you have the time, I have a couple of questions I want to check with you and discuss the preliminary API:

• XmlComponent#clearVariables is there to make sure that JSON-ifying the components results in something that xml will understand, correct? Does it have any other uses? Did you consider implementing it generically (similar to XmlComponent#replaceKey) at the base class?

• The initial implementation does not offer any way of modifying the structure of a table; only its cell contents (a paragraph) can be edited. This is in some ways similar to the way a paragraph style can only be applied once. Not sure if you'd like to eventually have all of these be proper getters and setters or if write-once is good enough. The way you use the current version is:

  var table = new docx.Table(numRows, numCols);
  var contentParagraph = table.getRow(x).getCell(y).content;
  // contentParagraph is a regular paragraph which you can modify as you please
  table.properties.setWidth('pct', 50 * 100);  // measured in .02%
  // In theory you could add more properties to table.properties...
  doc.addTable(table);

• Is there any opportunity for sharing code across components? I ask because writing this much of the table felt very boiler-platish, but I don't know since I'm not as familiar with the spec and the other components.

the docx not working when i uploaded in google driver

When i try to open file in driver, show the message: "Could not convert document."
I used the complete or basic example

const docx = require('docx');

var doc = new docx.Document();

var paragraph = new docx.Paragraph("Hello World");
var institutionText = new docx.TextRun("University College London").bold();
var dateText = new docx.TextRun("5th Dec 2015").tab().bold();
paragraph.addRun(institutionText);
paragraph.addRun(dateText);

doc.addParagraph(paragraph);

var exporter = new docx.LocalPacker(doc);
exporter.pack('My Document');

console.log('Document created successfully at project root!');

Table exemple + border styling.

Hello.
Could I have a table exemple with your package ?
Plus is it possible to define the border of this table ?
Thx.

SubList

Hi !
It's me again.
I'm actually triying to make a list with a sublist like this :

1.
   1.1
   1.2
2.
...

In order to do that, I'm basing my work on your exemple :

const numbering = new docx.Numbering();
const numberedAbstract = numbering.createAbstractNumbering();
const numberedAbstractLevel2 = numbering.createAbstractNumbering();
numberedAbstract.createLevel(0, "number", "%1.", "left");
numberedAbstractLevel2.createLevel(1, "number", "%1.2", "left");

const levelNumbering1 = numbering.createConcreteNumbering(numberedAbstract);
const levelNumbering2 = numbering.createConcreteNumbering(numberedAbstractLevel2);
doc.createParagraph('Test heading2 with double red underline').setNumbering(levelNumbering1, 0).heading1();

for(var opt = 1; opt < 4; opt++) {
    doc.createParagraph('Option ' + opt).setNumbering(levelNumbering2, 1);
}

doc.createParagraph('Test heading2 with double red underline').setNumbering(levelNumbering1, 0).heading1();

But this is the result I get :

1.
   0.2
   0.2
   0.2
2.
...

Where is my mistake ? Could you explain to me how the lists are working ?
Thanks :3

Error with docx and browserify

Hi,
I'm working on a project and I use Angularjs with Cordova. So I tried to put docx in a bundle with browserify but I got an error when I execute the code.

Everything is fine when browserify create the bundle but I get an error when the app use the bundle :

TypeError: fs$ReadStream is undefined line 14056

I checked the code and the variable legstream is undefined so I think the error comes from the legacy(fs) but I don't know why.

if (process.version.substr(0, 4) === 'v0.8') {
   var legStreams = legacy(fs)
   ReadStream = legStreams.ReadStream
   WriteStream = legStreams.WriteStream
 }

var fs$ReadStream = fs.ReadStream
console.log(legStreams);
ReadStream.prototype = Object.create(fs$ReadStream.prototype)
ReadStream.prototype.open = ReadStream$open

If someone already had this problem or used this module with browserify and can help me, thanks :)

Outdated dependency badge showing incorrect

Although the dependencies are up to date, the badge in the readme still says its out of date. I believe this is a bug with david-dm:

alanshaw/david-www#367

.docx file created via docx module is not opening.

I created a .docx file via this module, but it does not open. When I double-click on the file, following things happen.

Set table cell width

Hi,

I'm struggling to change the cell width. My code below doesn't have any affect on the table (the cells are both evenly spaced) What am I doing wrong?

var table = new docx.Table(1, 2); table.getCell(0, 1).cellProperties.setWidth(80, "pct"); table.getCell(0, 0).cellProperties.setWidth(20, "pct"); doc.addTable(table);

Request footnotes

Are you planning on implementing footnotes?
Congrats on very nice work. Awesome api!

I would like to know how to add or make a Table of Contents

.docx is not opening

So, When i am running the demo and add extension .docx to the filename. It seems to be corrupted and is not opening, while simple text file gets open.

How to use in Lambda?

Hi,
Just a question.
I'm porting some electron client side code over to Lambda cloud functions, but the two packers for docx seem to be to write out to a file (Lambda has a readonly file-system) or attach the doc to an Express response object. Is there any way to get the document as a Buffer? I can return it from my API if I can get it as a base64 string.
I'm currently playing around with a mock Express response object and seeing if I can get the data back out of it. I might try a 'fs' mock next, but presumably the best thing to do would be to write my own packer?
Cheers!

Read only file access in Lambda/cloud functions.

Hi i have used the basic codes to create the document in firebase functions.
`

Error: EROFS: read-only file system, open 'My Document.docx' at Error (native) | more_vert
`
this is the Log i'm getting. it seems we need to create a /tmp directory to write the file.
is there any workaround?
Thanks!

Typo in README

A comma should be a semicolon

diff --git a/README.md b/README.md
index acaad65..0ef42e6 100644
--- a/README.md
+++ b/README.md
@@ -60,7 +60,7 @@ var docx = require('docx');
 ```js
 var doc = new docx.Document();
         
-var paragraph = new docx.Paragraph(),
+var paragraph = new docx.Paragraph();
 var text = new docx.TextRun('Hello World');
 paragraph.addText(text);
 doc.addParagraph(paragraph);