title: How to change font in docx generated by JavaScript function
body: <p>I am a student and a learner. I am trying to make a new web app using JavaScript for the first time but I am not able to add my font or change the font in my word document generated by JavaScript. here is my code:</p>
  <pre><code> doc.addSection({
              properties: {},
              children: [
                  new docx.Paragraph({
                      children: [
                          new docx.TextRun({
                              text: x,
                              bold: true,
                              **fontFamily: 'Myfont',** 
  </code></pre>
  <p>Here the fontFamily is showing error:</p>
  <pre><code>                        }),
                      ],
                  }),
              ],
          });
  </code></pre>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  
  &lt;head&gt;
    &lt;script src="https://unpkg.com/docx@5.0.2/build/index.js"&gt;&lt;/script&gt;
    &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/FileSaver.js/1.3.8/FileSaver.js"&gt;&lt;/script&gt;
    &lt;link rel="stylesheet" type="text/css" href=""&gt;
    &lt;style type="text/css"&gt;
      @font-face {
        font-family: Myfont;
        src: url('Myfont2-Regular.ttf');
      }
      
      h1 {
        font-family: Myfont, sans-serif;
      }
    &lt;/style&gt;
  &lt;/head&gt;
  
  &lt;body&gt;
  
    &lt;h1&gt;This is my first word document!&lt;/h1&gt;
    &lt;input type="text" placeholder="Type something..." id="myInput"&gt;
  
    &lt;button type="button" onclick="generate()"&gt;Click to generate document&lt;/button&gt;
  
    &lt;script&gt;
      function generate() {
        const doc = new docx.Document();
        var x = document.getElementById('myInput').value;
  
        doc.addSection({
          properties: {},
          children: [
            new docx.Paragraph({
              children: [
                new docx.TextRun({
                  text: x,
                  bold: true,
                  fontFamily: 'Myfont',
                }),
              ],
            }),
          ],
        });
  
        docx.Packer.toBlob(doc).then(blob =&gt; {
          console.log(blob);
          saveAs(blob, "mydocument.docx");
          console.log("Document created successfully");
        });
      }
    &lt;/script&gt;
  
  &lt;/body&gt;
  
  &lt;/html&gt;</code></pre>
  </div>
  </div>
  </p>
  <p>Is there another syntax too so that I can style my word page format?</p>