Use with Vite

[Techiton]

How can i use this package with vite and astrojs, i was trying to implement this but i keep on getting this error

[0] 9:35:44 PM [vite] Internal server error: "ESM integration proposal for Wasm" is not supported currently. Use vite-plugin-wasm or other community plugins to handle this. Alternatively, you can use `.wasm?init` or `.wasm?url`. See https://vitejs.dev/guide/features.html#webassembly for more details.
[0]       at Context.load (file:///C:/Users/dynam/dosscord-astro/node_modules/.pnpm/[email protected]_@[email protected]/node_modules/vite/dist/node/chunks/dep-79892de8.js:41945:19)
[0]       at Object.load (file:///C:/Users/dynam/dosscord-astro/node_modules/.pnpm/[email protected]_@[email protected]/node_modules/vite/dist/node/chunks/dep-79892de8.js:43360:46)
[0]       at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
[0]       at async loadAndTransform (file:///C:/Users/dynam/dosscord-astro/node_modules/.pnpm/[email protected]_@[email protected]/node_modules/vite/dist/node/chunks/dep-79892de8.js:41038:24)

I tried installing the vite plugin and using .wasm?init or .wasm?url and it still returns that error

[stanleyyzhu]

I got the exactly same error but turned out that I can use the "argon2-bundled.min.js" instead

import argon2 from 'argon2-browser/dist/argon2-bundled.min.js';

[peterhirn]

@Techiton Did you figure out a way to make this work?

Update

I was able to make it work with Astro/Vite based on https://github.com/antelle/argon2-browser/blob/master/docs/js/calc.js

<removed this needlessly complicated code>

Edit: ended up publishing my own npm package 8 months later: https://github.com/phi-ag/argon2

[uint42]

The easiest way to get it working is to use import argon2 from 'argon2-browser/dist/argon2-bundled.min.js'; as this embeds the WASM binary in JavaScript. Unfortunately, this means you're stuck with argon2.wasm even though WebAssembly SIMD is now widely supported.

To enable TypeScript to recognize the types, include the following in your types.d.ts file:

declare module "argon2-browser/dist/argon2-bundled.min.js" {
    export * from "argon2-browser";
}