Vuejs Error while loading mediainfo.js package

Question

We have one we application where we record video for 30sec or 1 min and submit to server. The device can be anything.

When we do record from laptop for 30sec the size of the video is 60mb, if from latest iphone size is 180.

Our server loads video if the video size is less than 60mb

to fix this issue, i tried compressing video in front end using this example enter link description here which uses vuejs.

We are using vuero framrwork.

Tsubasa enter link description here using mediainfo.js package. I followed same code but i am facing this issue..

The issue is :

MediaInfoModule.wasm net::ERR_ABORTED 404 (Not Found) Could not load content for http://localhost:3000/node_modules/mediainfo.js/src/mediainfo.ts (HTTP error: status code 404, net::ERR_HTTP_RESPONSE_CODE_FAILURE)

Please check screenshot

My nodemodule structure as below, plugin we have added in vite.config.ts file

I researched on this issue try to fix but no luck.

Answer 1

It's not possible to tell exactly what you need to change as we don't see the relevant code.

Make sure the file MediaInfoModule.wasm can be loaded in the browser. Check the browsers network tab. It tells you where your frontend expects the file.

Note, that you can also set the file location explicitly using locateFile as shown in this example.

Disclaimer: I'm the author of mediainfo.js.