How to include mapboxgl-spiderifier in an angular application

Question

I have an angular application that uses mapbox through ngx-mapbox-gl and i want to integrate it with mapboxgl-spiderifier but it is with out typings and i dont know how to include it through importing. Things i have tried is to include the libarary through :

import "@bewithjonam/mapboxgl-spiderifier";

But it gives the following error :

ERROR in ./node_modules/@bewithjonam/mapboxgl-spiderifier/lib/mapboxgl-spiderifier.js Module not found: Error: Can't resolve 'MapboxglSpiderfier' in relative path

Answer 1

If you're using mapboxgl-spiderifier plugin lib, then first have it in your app by doing

npm i @bewithjonam/mapboxgl-spiderifier.

Then in .angular-cli.json in scripts, styles array add the url source url of this library:

{
 ...
 "apps": [{
   ...
   "styles": ["../node_modules/@bewithjonam/mapboxgl-spiderifier/lib/mapboxgl-spiderifier.css"],
   "scripts": ["../node_modules/@bewithjonam/mapboxgl-spiderifier/lib/mapboxgl-spiderifier.js"],
   ...
 }]
}

After that you can import it in any components like:

import "@bewithjonam/mapboxgl-spiderifier";