smartyellow/docx-js
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update documentation and README

Browse Source
This commit is contained in:
Dolan
2018-08-04 04:03:08 +01:00
parent 08a3538d8e
commit 7d05d69707
6 changed files with 74 additions and 80 deletions
Download Patch File Download Diff File Expand all files Collapse all files

59
README.md
View File

@ -31,15 +31,15 @@ Press `endpoint` on the `RunKit` website:
![RunKit Instructions](https://user-images.githubusercontent.com/2917613/38582539-f84311b6-3d07-11e8-90db-5885ae02c3c4.png) ![RunKit Instructions](https://user-images.githubusercontent.com/2917613/38582539-f84311b6-3d07-11e8-90db-5885ae02c3c4.png)
* https://runkit.com/dolanmiu/docx-demo1 - Simple paragraph and text * 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-demo2 - Advanced Paragraphs and text
* https://runkit.com/dolanmiu/docx-demo3 - Bullet points * https://runkit.com/dolanmiu/docx-demo3 - Bullet points
* https://runkit.com/dolanmiu/docx-demo4 - Simple table * https://runkit.com/dolanmiu/docx-demo4 - Simple table
* https://runkit.com/dolanmiu/docx-demo5 - Images * https://runkit.com/dolanmiu/docx-demo5 - Images
* https://runkit.com/dolanmiu/docx-demo6 - Margins * https://runkit.com/dolanmiu/docx-demo6 - Margins
* https://runkit.com/dolanmiu/docx-demo7 - Landscape * https://runkit.com/dolanmiu/docx-demo7 - Landscape
* https://runkit.com/dolanmiu/docx-demo8/1.0.1 - Header and Footer * https://runkit.com/dolanmiu/docx-demo8/1.0.1 - Header and Footer
* https://runkit.com/dolanmiu/docx-demo10 - **My CV generated with docx** * https://runkit.com/dolanmiu/docx-demo10 - **My CV generated with docx**
#### Run demos locally: #### Run demos locally:
@ -49,50 +49,17 @@ $ npm run demo
This command will run the demo selector app in the `demo` folder. It will prompt you to select a demo number, which will run a demo from that folder. This command will run the demo selector app in the `demo` folder. It will prompt you to select a demo number, which will run a demo from that folder.
## Guide ## How to
Please refer to [the Wiki](https://github.com/dolanmiu/docx/wiki) for details on how to use this library, examples and much more! Please refer to [https://docx.js.org/](https://docx.js.org/) for details on how to use this library, examples and much more!
Full documentation can be found here: [http://dolanmiu.github.io/docx/index.html](http://dolanmiu.github.io/docx/index.html)
## Simple Usage
```js
// Used to create docx files
var docx = require("docx");
// Create document
var doc = new docx.Document();
// Add some content in the document
var paragraph = new docx.Paragraph("Some cool text here.");
// Add more text into the paragraph if you wish
paragraph.addRun(new docx.TextRun("Lorem Ipsum Foo Bar"));
doc.addParagraph(paragraph);
// Used to export the file into a .docx file
var exporter = new docx.LocalPacker(doc);
// Or use the express packer to make the file downloadable.
// res is express' Response object
var exporter = new docx.ExpressPacker(doc, res);
exporter.pack("My First Document");
// If you want to export it as a .pdf file instead
exporter.packPdf("My First Document");
// done! A file called 'My First Document.docx'
// will be in your file system if you used LocalPacker
// Or it will start downloading if you are using Express
```
## Examples ## Examples
Check [the Wiki](https://github.com/dolanmiu/docx/wiki/Examples) and the [demo folder](https://github.com/dolanmiu/docx/tree/master/demo) for examples. Check the examples section in the [documentation](https://docx.js.org/#/usage/examples) and the [demo folder](https://github.com/dolanmiu/docx/tree/master/demo) for examples.
# Contributing # Contributing
Read the contribution guidelines [here](https://github.com/dolanmiu/docx/wiki/Contributing-Guidelines). Read the contribution guidelines [here](https://docx.js.org/#/contribution-guidelines).
# Honoured Mentions # Honoured Mentions

34
docs/README.md
View File

@ -3,30 +3,50 @@
</p> </p>
<p align="center"> <p align="center">
Easily generate .docx files with JS/TS. Easily generate .docx files with JS/TS. :100:
</p> </p>
--- ---
# Welcome # Welcome
## Getting Started ## Installation
### Installation
```sh ```sh
$ npm install --save docx npm install --save docx
``` ```
Then you can `require` or `import` as usual: Then you can `require` or `import` as usual:
``` ```js
let docx = require('docx'); let docx = require('docx');
``` ```
``` ```js
import * as docx from 'docx' import * as docx from 'docx'
``` ```
## Basic Usage
```js
var docx = require("docx");
// Create document
var doc = new docx.Document();
// Add some content in the document
var paragraph = new docx.Paragraph("Some cool text here.");
// Add more text into the paragraph if you wish
paragraph.addRun(new docx.TextRun("Lorem Ipsum Foo Bar"));
doc.addParagraph(paragraph);
// Used to export the file into a .docx file
var exporter = new docx.LocalPacker(doc);
exporter.pack("My First Document");
// Done! A file called 'My First Document.docx' will be in your file system if you used LocalPacker
```
--- ---

4
docs/contribution-guidelines.md
View File

@ -4,7 +4,7 @@
* Include documentation reference(s) at the top of each file: * Include documentation reference(s) at the top of each file:
```ts ```js
// http://officeopenxml.com/WPdocument.php // http://officeopenxml.com/WPdocument.php
``` ```
@ -18,7 +18,7 @@ Please write a test of every file you make and suffix it with `.spec.ts`.
Here is a template of a test: Here is a template of a test:
```ts ```js
import { assert } from "chai"; import { assert } from "chai";
describe("ClassName", () => { describe("ClassName", () => {

39
docs/index.html
View File

@ -1,23 +1,30 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>docx - Generate .docx documents with JavaScript</title> <title>docx - Generate .docx documents with JavaScript</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta name="description" content="Generate .docx documents with JavaScript"> <meta name="description" content="Generate .docx documents with JavaScript">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<link rel="stylesheet" href="//unpkg.com/docsify/lib/themes/vue.css"> <link rel="stylesheet" href="//unpkg.com/docsify/lib/themes/vue.css">
</head> </head>
<body> <body>
<div id="app"></div> <div id="app"></div>
<script> <script>
window.$docsify = { window.$docsify = {
name: 'docx', name: 'docx',
repo: 'https://github.com/dolanmiu/docx', repo: 'https://github.com/dolanmiu/docx',
loadSidebar: true, loadSidebar: true,
subMaxLevel: 2 subMaxLevel: 2,
} search: 'auto',
</script> }
<script src="//unpkg.com/docsify/lib/docsify.min.js"></script> </script>
<script src="//unpkg.com/docsify/lib/docsify.min.js"></script>
<script src="//unpkg.com/docsify/lib/plugins/emoji.min.js"></script>
<script src="https://unpkg.com/docsify-copy-code@2"></script>
<script src="//unpkg.com/docsify/lib/plugins/search.min.js"></script>
</body> </body>
</html> </html>

8
docs/usage/headers-and-footers.md
View File

@ -4,21 +4,21 @@
Creating Headers and footers is simple. Access the `Header` and `Footer` by doing so like this: Creating Headers and footers is simple. Access the `Header` and `Footer` by doing so like this:
```ts ```js
doc.Header; doc.Header;
doc.Footer; doc.Footer;
``` ```
You can call the same methods as you would with a `File`: You can call the same methods as you would with a `File`:
```ts ```js
doc.Header.createParagraph("Header text"); doc.Header.createParagraph("Header text");
doc.Footer.createParagraph("Footer text"); doc.Footer.createParagraph("Footer text");
``` ```
Even add images: Even add images:
```ts ```js
doc.Header.createImage([PATH_TO_YOUR_IMAGE]); doc.Header.createImage([PATH_TO_YOUR_IMAGE]);
doc.Footer.createImage([PATH_TO_YOUR_IMAGE]); doc.Footer.createImage([PATH_TO_YOUR_IMAGE]);
``` ```
@ -31,7 +31,7 @@ Also all the supported section properties are implemented according to: http://o
### Example ### Example
```ts ```js
const header = this.document.createHeader(); const header = this.document.createHeader();
const footer = this.document.createFooter(); const footer = this.document.createFooter();

10
docs/usage/images.md
View File

@ -6,7 +6,7 @@ Adding images is very simple
Simply call the `createImage` method: Simply call the `createImage` method:
```ts ```js
const image = doc.createImage([PATH_TO_YOUR_IMAGE]); const image = doc.createImage([PATH_TO_YOUR_IMAGE]);
``` ```
@ -32,7 +32,7 @@ In Word this is found in:
The `PictureRun` element support various options to define the positioning of the element in the document. The `PictureRun` element support various options to define the positioning of the element in the document.
```ts ```js
interface DrawingOptions { interface DrawingOptions {
position?: PlacementPosition; position?: PlacementPosition;
textWrapping?: TextWrapping; textWrapping?: TextWrapping;
@ -42,7 +42,7 @@ interface DrawingOptions {
can be passed when creating `PictureRun()` for example: can be passed when creating `PictureRun()` for example:
```ts ```js
const imageData = document.createImageData(filename, buffer, 903, 1149); const imageData = document.createImageData(filename, buffer, 903, 1149);
new docx.PictureRun(imageData, { new docx.PictureRun(imageData, {
@ -68,7 +68,7 @@ When placement position is FLOATING then we can use two options:
for `drawingOptions.textWrapping` we can define various options. `textWrapping` has the following properties: for `drawingOptions.textWrapping` we can define various options. `textWrapping` has the following properties:
```ts ```js
interface TextWrapping { interface TextWrapping {
textWrapStyle: TextWrapStyle; textWrapStyle: TextWrapStyle;
wrapTextOption?: WrapTextOption; wrapTextOption?: WrapTextOption;
@ -94,7 +94,7 @@ enum WrapTextOption {
When we want to position the image relative or absolute then we need to use option `drawingOptions.floating`: When we want to position the image relative or absolute then we need to use option `drawingOptions.floating`:
```ts ```js
export interface Floating { export interface Floating {
horizontalPosition: HorizontalPositionOptions; horizontalPosition: HorizontalPositionOptions;
verticalPosition: VerticalPositionOptions; verticalPosition: VerticalPositionOptions;