Render docx in React js

Question

I would like to properly render a docx file in React JS with the correct formatting, as it would appear in Word or a similar service. Currently, when displaying the text, all formatting is removed and appears as plain text. I obtain the file from the server, and process it, by:

const url = "http://localhost:8080/files/aboutme.docx";

axios.get(url, {
  responseType: 'arraybuffer',
}).then(response => {
  var doc = new Docxtemplater(new PizZip(response.data), {
    delimiters: {
      start: 'ran',
      end: 'ran'
    }
  });
  var text = doc.getFullText();
  setAboutMe(text);
})

I am using the Docxtemplater and PizZip libraries.

Answer 1

Docxtemplater is

a library to generate docx/pptx documents from a docx/pptx template

If you need to render a docx file I think you should use react-doc-viewer. Then you could write something like:

import DocViewer from "react-doc-viewer";

function App() {
  const doc = [{ uri: "http://localhost:8080/files/aboutme.docx" }];

  return <DocViewer documents={doc} />;
}