how to produce mediasoup-client.js

mediasoup libraries
1

I write a webpack.config.js and run webpack –mode production to get ./dist/mediasoup-client.js

when I run the following code, it appears that TypeError: cannot read properties of undefined (reading ‘Device’). What happened? Anyone could help me with this? Thanks in advance.

let device = null; try { device = new MediasoupClient.Device(); } catch (err) { if (err.name === “UnsupportedError”) { console.error(“mediasoup-client doesn’t support this browser”); return; } } global.mediasoup.device = device;

webpack.config.js
‘
const path = require(‘path’);

module.exports = {
entry: ‘./lib/index.js’,
output: {
filename: ‘mediasoup-client.js’,
path: path.resolve(__dirname, ‘dist’),
},
};
‘
I use npm run typescript:build to get lib/index.js

2

I have tried another webpack.config.js as follows. The result is the same. run MediasoupClient.Device() causes TypeError of undefined function.

const path = require(‘path’);

module.exports = {
mode: ‘development’,
entry: ‘./src/index.ts’,
output: {
filename: ‘mediasoup-client.js’,
path: path.resolve(__dirname, ‘dist’),
},
module: {
rules: [
{
test: /.ts$/,
use: ‘ts-loader’,
exclude: /node-modules/
}
]
},
resolve: {
extensions: [‘.ts’, ‘.js’]
}
};

3

There is a better way of doing it, instead of converting mediasoup-client to vanila js, just include the mediasoup-client library from node_modules into your js file lets say call.js and then do your stuff as mentioned in the docs in that file and use webpack to bundle that call.js file.

4

yes. I understand what you refer. could you please review my webpack.config.js as follows?
‘
const path = require(‘path’);

module.exports = {
entry: ‘./lib/index.js’,
output: {
filename: ‘bundle.js’,
path: path.resolve(__dirname, ‘dist’),
},
};
‘ I encounter the same issue that Device undefined(TypeError).

5

So, what is ‘MediasoupClient’? Where do you import or assign it?

6

Yes this seems fine, show us the full code, how you are including mediasoup-client into your code, and how you are bundling mediasoup-client?

7

fixed.
write a index.js as follows, then use webpack to produce the mediasoup-client.js for web using.
const client = require(‘mediasoup-client’)
window.mediasoupClient = client