Include a third library js without typings

Ionic Framework ionic-v3
1

Hello everybody,

I tried to use nipplejs libray in ionic 2 but without success.

I have added the library with npm like this:

npm install nipplejs --save

In my home.ts, i have added:

declare var nipplejs: any;

and in the constructor:

var radius = 100;

var sampleJoystick = {
    mode: 'dynamic',
    position: {
      left: '50%',
      top: '50%'
    },
    size: radius*2,
    color: 'black'
};

var joystick;
var position;
joystick = nipplejs.create(sampleJoystick);

but with ‘ionic serve’ i have this error :

ReferenceError: nipplejs is not defined
at new HomePage (http://localhost:8100/build/main.js:35447:20)
at _View_HomePage_Host0.createInternal (HomePage_Host.ngfactory.js:16:24)

When i add a library with “npm --save”, normally the ionic build add automaticaly the js to the app, no ?

Best regards

2

No. You need to tell the bundler that you are using the library (via either import or require somewhere, but require probably won’t work if you’re using rollup - you will have better luck with webpack). Something like:

var nipplejs:any = require('nipplejs');
3

Thanx
I have replaced the ‘declare’ by
import * as nipples from 'nipples’
and it’s ok !!
I was beleiving it is just for real module ts/es5 !?!?

Emmanuel

1 Like