Importing Javascript to Angular Component Issue

Question

In a given component I have the following import:

import { Gantt } from '@frappe-gantt';

This @frappe-gantt is declared in tsconfig.json , under paths property, as

  "@frappe-gantt": [
    "frappe-gantt"
  ]

In a given folder, called frappe-gantt, I also have the following index.ts :

import * as Gantt from './frappe-gantt.js';

export {Gantt};

And the following frappe-gantt.js as:

var Gantt= (function (id,tasks,options) {
...
class Gantt {
...
constructor(param1,param2,param3){...}
...
}
return Gantt;
}());

However, calling new Gantt(params,params2,params3) in the component, using the onInit function, it gives me the following:

_frappe_gantt__WEBPACK_IMPORTED_MODULE_3__.Gantt is not a constructor

Does anyone have any clue on what the issue should be?

Thanks!

Answer 1

Following my comment, stick to basic syntax to make it work.

 var v1 = (function() {})(); // IIFE console.log(v1); // undefined var v2 = (function() {}()); // Your take on a IIFE console.log(v2); // undefined var v3 = function() {}; // A function that can be used with the new keyword var i3 = new v3(); console.log(v3, i3); // displays the function and the instance of that function class V4 {} // A JS class var i4 = new V4(); console.log(V4, i4); // Displays the class and the instance of that class