0

In this angular2 plunkr, I am trying to import two.js (third party lib) and bootstrap it into my application. Using system.config.js, I added the following lines among the mappings and packages vars :

  var map = {
        ...othermappings
       'two.js' : 'https://npmcdn.com/two.js@0.6.0/src'
     };
 var packages = {
         ...otherpackages
       'two.js': { main: 'two.js', defaultExtension: 'js' },
   }

Inside main.ts, If I uncomment the following line:

import {Two} from 'two.js';

and also added :

bootstrap(AppComponent, [
    ...others,
    //Two
 ])

I get the follwoing error:

(index):20 Error: TypeError: Cannot read property 'isFunction' of undefined(…)
Tunity
  • 141
  • 1
  • 2
  • 7

1 Answers1

1

This error occurs on the line:

hasEventListeners: _.isFunction(root.addEventListener),

As you can see isFunction is a method of _ object. It's underscore.

From the Two.js documentation:

N.B. Two.js requires Underscore.js and Backbone.js Events. If you're already loading these files elsewhere then you can build the project yourself and get the file size even smaller.

This way, first step is to load underscore and backbone plunkr

See index.html

<!-- Two.js dependencies -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.3.3/backbone-min.js"></script>

Second step is to change your import statement from

import {Two} from 'two.js';

to

import * as Two  from 'two.js'

After that Two will be your desired function.

Plunker

yurzui
  • 205,937
  • 32
  • 433
  • 399
  • thanks for the reply. If you uncomment line 17 in main.ts where: "//Two" the plunk does not load and passes the error I am referring to. – Tunity Jul 29 '16 at 19:25
  • I've updated plunker http://plnkr.co/edit/dHN8vTQ4wUTfD9kugf2q?p=preview. But i think that you need't be used two.js as a provider. You can just use it like `new Two` where you want – yurzui Jul 29 '16 at 19:55
  • thanks for the update. I am exactly challenged by the inclusion of a third party lib with angular2, this is why I am trying to import and bootstrap two.js as a provider. – Tunity Jul 30 '16 at 15:05