buzz/mediainfo.js

how to use this in vue3 vite?

invokeCallback opened this issue · 2 comments

how to use this in vue3 vite?

vue3 often use vite to pack rather than webpack, so... i wanna know how set the config in vite.config.js ,thx so much

You can run :

pnpm i vite-plugin-static-copy -D

And then, in your vite.config.ts file, add the following :

import { viteStaticCopy } from 'vite-plugin-static-copy';

const wasmFile = resolve(__dirname, 'node_modules', 'mediainfo.js', 'dist', 'MediaInfoModule.wasm');

export default defineConfig({
    plugins: [
        // ...
        viteStaticCopy({
            targets: [{ src: wasmFile, dest: '.' }],
        }),
    ]
});

Then load the library like so :

<template>
//
</template>

<script lang="ts">
import { defineComponent, onMounted } from 'vue';
import MediaInfoFactory from 'mediainfo.js';

export default defineComponent({
    setup() {
        onMounted(() => {
            MediaInfoFactory().then(() => {
                console.log('Loaded');
            });
        });
    }
});
</script>