I am trying to integrate mammoth npm library with meteor.

When using the import mand, import { mammoth } from "mammoth"; was getting

Uncaught TypeError: Cannot read property 'bind' of undefined

When using the mand, declare var mammoth: any; was getting

EXCEPTION: mammoth is not defined

The code I am using is

this.readFileInputEventAsArrayBuffer(event, function(arrayBuffer) {
      mammoth
        .convertToHtml({ arrayBuffer: arrayBuffer })
        .then(function(result: any) {
          var html = result.value; // The generated HTML
          var messages = result.messages; // Any messages, such as warnings during conversion
          // console.log('html: ' + html);
          document.getElementById("output").innerHTML = html;
          var elements = document.getElementById("output").children;
          console.log(elements);
          console.log(JSON.stringify(elements));
          console.log(elements.length);
          for (var i = 0; i < elements.length; i++) {
            console.log(i + " --- ");
            console.log(elements[i]);
            var data = elements[i].innerHTML;
            // elements[i].setAttribute("draggable","true");
          }
        })
        .done();
      console.log(
        "event in fileUpload-readFileInputEventAsArrayBuffer" + event
      );
    });

I am trying to integrate mammoth npm library with meteor.

When using the import mand, import { mammoth } from "mammoth"; was getting

Uncaught TypeError: Cannot read property 'bind' of undefined

When using the mand, declare var mammoth: any; was getting

EXCEPTION: mammoth is not defined

The code I am using is

this.readFileInputEventAsArrayBuffer(event, function(arrayBuffer) {
      mammoth
        .convertToHtml({ arrayBuffer: arrayBuffer })
        .then(function(result: any) {
          var html = result.value; // The generated HTML
          var messages = result.messages; // Any messages, such as warnings during conversion
          // console.log('html: ' + html);
          document.getElementById("output").innerHTML = html;
          var elements = document.getElementById("output").children;
          console.log(elements);
          console.log(JSON.stringify(elements));
          console.log(elements.length);
          for (var i = 0; i < elements.length; i++) {
            console.log(i + " --- ");
            console.log(elements[i]);
            var data = elements[i].innerHTML;
            // elements[i].setAttribute("draggable","true");
          }
        })
        .done();
      console.log(
        "event in fileUpload-readFileInputEventAsArrayBuffer" + event
      );
    });

 readFileInputEventAsArrayBuffer(event, callback) {
    var file = event.target.files[0];

    var reader = new FileReader();

    reader.onload = function(loadEvent: any) {
      var arrayBuffer = loadEvent.target.result;
      console.log("arrayBuffer: ");
      console.log(arrayBuffer);
      callback(arrayBuffer);
    };

    reader.readAsArrayBuffer(file);
  }

When using the import

declare var mammoth: any;

getting the error

ReferenceError: mammoth is not defined
at app.ponent.ts:75
at FileReader.reader.onload (app.ponent.ts:109)
at ZoneDelegate.invoke (modules.js:22723)
at Object.onInvoke (modules.js:57096)
at ZoneDelegate.invoke (modules.js:22722)
at Zone.runGuarded (modules.js:22607)
at FileReader.<anonymous> (modules.js:22585)

Uncaught ReferenceError: mammoth is not defined
at app.ponent.ts:75
at FileReader.reader.onload (app.ponent.ts:109)
at ZoneDelegate.invoke (modules.js:22723)
at Object.onInvoke (modules.js:57096)
at ZoneDelegate.invoke (modules.js:22722)
at Zone.runGuarded (modules.js:22607)
at FileReader.<anonymous> (modules.js:22585)

When using the import

import { mammoth } from "mammoth";

getting the error

Uncaught TypeError: Cannot read property 'bind' of undefined
at meteorInstall.node_modules.mammoth.lib.docx.files.js (modules.js?hash=cd1f432…:83272)
at fileEvaluate (modules-runtime.js?hash=637cb12…:191)
at require (modules-runtime.js?hash=637cb12…:116)
at meteorInstall.node_modules.mammoth.lib.docx.docx-reader.js (modules.js?hash=cd1f432…:82091)
at fileEvaluate (modules-runtime.js?hash=637cb12…:191)
at require (modules-runtime.js?hash=637cb12…:116)
at meteorInstall.node_modules.mammoth.lib.index.js (modules.js?hash=cd1f432…:81954)
at fileEvaluate (modules-runtime.js?hash=637cb12…:191)
at require (modules-runtime.js?hash=637cb12…:116)
at meteorInstall.client.imports.app.app.ponent.js (app.ponent.ts:12)
at fileEvaluate (modules-runtime.js?hash=637cb12…:191)
at require (modules-runtime.js?hash=637cb12…:116)
at meteorInstall.client.imports.app.index.js (index.ts:1)
at fileEvaluate (modules-runtime.js?hash=637cb12…:191)
at require (modules-runtime.js?hash=637cb12…:116)
at meteorInstall.client.main.js (main.ts:5)
at fileEvaluate (modules-runtime.js?hash=637cb12…:191)
at require (modules-runtime.js?hash=637cb12…:116)
at demo.collection.ts:4

Please help in this.

P.S.: When running as a angular project, it is working fine. Facing the issue, when doing it in angular-meteor project.

• javascript
• meteor
• npm
• node-modules
• mammoth

• 1 How are you importing the mammoth lib into your page? – Raven Commented Jun 21, 2017 at 12:14
• try import mammoth from "mammoth";? – Alex K Commented Jun 21, 2017 at 12:33
• @Alex, when I import using that, getting this Uncaught TypeError: Cannot read property 'bind' of undefined. My doubt is whether the integration/usage of mammoth library supported in meteor? – ARUN DAVID JOHNSON Commented Jun 21, 2017 at 12:46
• please note no { and } in my example – Alex K Commented Jun 21, 2017 at 12:47
• @Raven, I am importing the mammoth lib by trying the following, import { mammoth } from "mammoth"; import mammoth from "mammoth"; declare var mammoth: any; var mammoth = require("mammoth"); – ARUN DAVID JOHNSON Commented Jun 21, 2017 at 12:48

3 Answers 3

Try and see if this works: import 'mammoth/mammoth.browser'; (browser build)

Or if you can may want to do this on the front-end, then you can use then include the following scripts onto your html page and do it on runtime. (Converting doc to html and rendering)

• As, also shown in this article -> https://mike.zwobble/projects/mammoth/

Script to be included:

• demo.js -> https://mike.zwobble/static/projects/mammoth/demo.js
• mammoth.browser.min.js -> https://mike.zwobble/static/projects/mammoth/mammoth.browser.min.js

Hope this helps.

If you look at the source code of the mammoth npm package, you will see that there is no 'mammoth' nor default exported. It does, however, export each of the methods, so you can do it like this:

import {convertToHtml} from "mammoth";

convertToHtml({path: "path/to/document.docx"})
    .then(function(result){
        var html = result.value; // The generated HTML 
        var messages = result.messages; // Any messages, such as warnings during conversion 
    })
    .done();

That should do the trick :)

Try to import like this: import {convertToHtml} from 'mammoth/mammoth.browser';

Inside ponet.ts file:

import {convertToHtml} from "mammoth/mammoth.browser";
                   

convertToHtml({ arrayBuffer: arrayBuffer })
.then(function(result){
    var html = result.value; // The generated HTML
    var messages = result.messages; // Any messages, such as warnings during conversion
})
.done();

Above code worked for me in angular 9.