Correct way to include 3rd party libs with no typings

Ionic Framework ionic-v3
1

Hi there,

I’m developing an ionic 2 app that makes use of a 3rd party library / script that has no typescript definitions.

I can use the script inside my components by using the syntax:

declare var MyThirdPartyScript: any

I then stick the script inside the www/index.html file with a script tag:

<script src="build/path/to/MyThirdPartyScript.js"></script>

However, whenever I run ionic serve, my index.html file is overwritten!! What is the correct way to include such a library in my project, so that I don’t have to manually insert it after every build??

2

For ionic rc0+ correct way is to follow this tutorial.
Short algorithm:

  1. In terminal in project root folder npm install --save MyThirdPartyLibrary
  2. In src/declarations.d.ts (maybe in your project this file located in other place) add line
declare module 'MyThirdPartyLibrary'
  1. And use library in service:
import MyThirdPartyLibrary from 'MyThirdPartyLibrary';
1 Like
3

Thanks for the quick answer.

I should have mentioned, the library is not available on npm… so is there a work around for my situation?

4

I think, you can:

  1. Fork your ThirdPartyLibrary on github. Create npm package for it and use module from your github repository.
  2. Try find alternative library, that have npm support.
  3. (Not tested). If your library is simple (It consists of a single file and does not need to import other libraries) - you can try to convert it to typescript module and use it directly in your app like other services.
5

Ok… thanks again. 1. is probably the only option I can use for this particular case.