How to use clmtrackr

[ihateids]

I am having trouble using clmtrackr (https://github.com/auduno/clmtrackr) with the template. clm is undefined in the browser no matter what approach I use for import. The library works perfectly fine with public javascript p5 examples.

Using the same way as for qrcode library does not work (import clm = require('clmtrackr')). I would be very grateful for any help. My package.json:

"dependencies": {
"clmtrackr": "^1.1.2",
"qrcode-generator": "^1.4.4"
},
"devDependencies": {
"@types/p5": "^1.3.3",
"@types/clmtrackr": "^1.1.1",
"browser-sync": "^2.26.12",
"npm-run-all": "^4.1.5",
"typescript": "^3.8.3"
}

[Gareth Williams]

Have you added <script src="js/clmtrackr.js"></script> to your html header?

[ihateids]

Yes

<script src="https://cdnjs.cloudflare.com/ajax/libs/clmtrackr/1.1.2/clmtrackr.module.min.js"
integrity="sha512-7OFCfpuVLXb+5EVhz0G2O5BYhfqvmMgiMmx3AJhgYSgwisUSLCW0R8JgHisRVKooL9SGhvu2IrGHkZ27GFTUug=="
    crossorigin="anonymous"
    referrerpolicy="no-referrer">
  </script>

the module was fetched by the browser, http status 200:

This is in my global.d.ts:

import * as p5Global from 'p5/global' 
import module = require('p5');
export = module;
export as namespace p5;

import qrcode = require('qrcode-generator');
import clm = require('clmtrackr');

and this is how it looks in sketch. linting shows that clm is unknown, and qrcode lib is ok:

[Gareth Williams]

Ok, so it appears that the clm is not defined correctly within clmtrackr d.ts file.

This will declare the variable properly for you :)

// add to global.d.ts
import clmtrackr from 'clmtrackr';
declare global {namespace clm { class tracker extends clmtrackr.tracker {} }}

you can then do this (as per documentation found at: https://github.com/auduno/clmtrackr)

// index.ts
var ctracker = new clm.tracker();

Let me know if you get stuck sir :)

[ihateids]

This is a great hack. linting works perfectly. Thank you :)

I am just still struggling with clm, it is undefined in browser :(

[Gareth Williams]

I think you might have pulled in the wrong js file from https://cdnjs.com/libraries/clmtrackr. You want clmtrackr.min.js not clmtrackr.module.min.js

[ihateids]

omg, you are right :) Thank you so much for your help. How can I send you a cup of coffee, please ? Or beer?