3

im importing some "legacy" (non typescript) js libs to my angular SPA.

normally I just add a load from the cdn to index.html like:

<script src="//cdnjs.cloudflare.com/ajax/libs/pako/1.0.6/pako.min.js"></script>

and in the angular-component i just decale

declare var pako: any;

this typically works. Now i like to "host" this lib locally. I can add it to the angular project with

npm install pako

But how do I add it than to the angular app ?
I tested adding an import to polyfills.ts (this works for hammerjs but not for pako)

Also this should work for ng build (and than probably get added to the compiled / packed runtime.js

BTW: here is a test stackblitz https://stackblitz.com/edit/ng-load-pako

mhoff
  • 601
  • 8
  • 13
  • https://stackoverflow.com/a/51897552/2622292 – SiddAjmera Sep 03 '18 at 20:10
  • You’ve added it via an external script reference. Others that install pako will also have to do the same - via a script tag. – Michael Kang Sep 03 '18 at 20:14
  • actually to import below works fine and sound elegant to me for the npm package. I do not need to know the path to the lib pako.min.js just the npm package name. Have not tried the script tga in angular.json - is there any advantage ? (for both it seems to got packed into vendor.js) – mhoff Sep 04 '18 at 14:20
  • type definitions for pako: https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/types/pako/index.d.ts – tom May 30 '22 at 05:43

1 Answers1

7

I love all the questions that provide a stackblitz link so that I can easily provide the correct answer:

https://stackblitz.com/edit/ng-load-pako-gfunsb

Basically, you just need to do:

import * as pako from 'pako';

Xinan
  • 3,002
  • 1
  • 16
  • 18