Hi, thanks very much for the replies. This is the heart of the matter for us, we can’t get it to work in this way, or trying to follow what we see in the JM repo. We have cloned the JM repo and looked around extensively to find how the lib is being implemented but still can’t figure out how to mirror what is working in JM. Your help in getting to the bottom of what we are doing wrong will be very much appreciated, and I’m sure moving towards a working solution for TS React with the official LJM library will be very useful for the whole community. We are certainly very happy to share what works for us as we go forward if we can get some help integrating the package!
We have embedded the script tag as you’ve suggested but that does not enable the lib to be brought into React code and used. Since we are using an NPM install, and not a local minified copy like JM does, we figure that script tag must be something like this:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>JitsiLibTest</title>
<base href="/" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="icon" type="image/x-icon" href="/favicon.ico" />
<link rel="stylesheet" href="/src/styles.scss" />
<script src="node_modules/lib-jitsi-meet/dist/esm/index.js"></script>
</head>
<body>
<div id="root"></div>
<script type="module" src="/src/main.tsx"></script>
</body>
</html>
I do see that in our built JM app on the server, the file "libs/app.bundle.min.js exists and can be imported but this app is already build and bundled… in the JM github repo that i clone, when installing all packages, the only instance of LJM I can see is that in the node_modules folder, exported from node_modules/lib-jitsi-meet//dist/umd/lib-jitsi-meet.min.js
So, we do see how the script tag is needed in the root html file but it is not clear to us where it should link, and also how this script tag relates to the installed package via this dependency in our pacakge.json file:
"lib-jitsi-meet": "https://github.com/jitsi/lib-jitsi-meet/releases/download/v1561.0.0+2d4cd935/lib-jitsi-meet.tgz",
we are stuck on is how to actually import the library in the TS files.
import JitsiMeetJS from 'lib-jitsi-meet';
does not work, with the failures posted above.
We see in the JM repo that in react/features/base/lib-jitsi-meet/index.ts the lib is being imported as:
import JitsiMeetJS from './_';
export { JitsiMeetJS as default };
and that seems to refer to the _.native.js and/or _.web.js files, where in _.native.js it is being imported as
import './native';
import JitsiMeetJS from 'lib-jitsi-meet';
export { JitsiMeetJS as default };
and for _.web.js it is is being declared as:
// @flow
declare var JitsiMeetJS: Object;
export default JitsiMeetJS;
but that is where we’re losing understanding of what is going on. I have tried also dropping these files into our project but trying to import JitsiMeetJS from './_' fails. with Cannot find module './_' or its corresponding type declarations. The way that the lib is being imported and used in JM, with this underscore, is using a method we have never seen before, and we can’t understand how to do the same for our own React project.
Apologies for the long post, just trying to describe in better detail the issue we are facing, what we are trying to achieve and what we have already tried. Many thanks again!