doc.createParagraph not a function - docx

Question

EDIT: Solved (they changed their documentation and I wasn't doing it correctly).

I'm attempting to use the docx NPM package to create docx files in JavaScript. I've copied and pasted the documentation to "get started" and it's returning a "doc.addParagraph" is not a function for each of the lines in the function handler. According to the documentation, the docx package can be run on both the frontend and backend, so I've copied and pasted the documentation starter-kit into my react web app, but it's not working properly.

Here is the documentation: https://docx.js.org/#/

Here is the browser example of docx on the front-end: https://codepen.io/anon/pen/dqoVgQ

And here is my code in my react web app:

import React, { Component } from 'react';
import { connect } from 'react-redux';
import { Link, withRouter } from 'react-router-dom';
import PropTypes from 'prop-types';

import * as fs from 'fs';
import { Document, Packer, Paragraph, TextRun } from 'docx';

class Template1 extends Component {

    constructor (props) {
        super(props);
        this.state = {
            errors: {}
        }
        this.onGenerate = this.onGenerate.bind(this);
    }

    onGenerate = (e) => {
        const doc = new Document();

        doc.createParagraph('hello world').heading1();



        const paragraph = new Paragraph("Hello World");
        const institutionText = new TextRun("Foo Bar");
        const dateText = new TextRun("Github is the best")
        paragraph.addRun(institutionText);
        paragraph.addRun(dateText);

        doc.addParagraph(paragraph);

        const packer = new Packer();

        packer.toBuffer(doc).then((buffer) => {
            console.log(buffer);
            // saveAs(blob, "example.docx");
            fs.writeFileSync('example.docx', buffer);
            console.log("Document created successfully");
        });
    }

    componentDidMount() {

    }


  render() {

    const { errors } = this.state;


    return (
        <div>
            <section id="testing-download-docx-button">
                <div className="row">
                    <div className="col-xl-12 col-lg-12 col-md-12 col-sm-12">
                        <button onClick={this.onGenerate.bind(this)} className="button text-center red-outline-button d-inline-block">Download DocX</button>
                    </div>
                </div>
            </section>
      </div>
    )
  }
}

Template1.propTypes = {
    errors: PropTypes.object.isRequired
}

const mapStateToProps = state => ({
    errors: state.errors
});

export default connect(mapStateToProps, {  })(withRouter(Template1));

Answer 1

There isn't any addParagraph method in the Document class. Actually it should be added using addSection.

Like

doc.addSection({
    children: [
        new Paragraph({
            children: [new TextRun("Lorem Ipsum Foo Bar"), new TextRun("Hello 
                      World")],
            }),
    ],
});