antelle/argon2-browser

Use with Vite

Techiton opened this issue · 3 comments

Techiton commented

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/vite@4.2.1_@types+node@18.15.11/node_modules/vite/dist/node/chunks/dep-79892de8.js:41945:19)
[0]       at Object.load (file:///C:/Users/dynam/dosscord-astro/node_modules/.pnpm/vite@4.2.1_@types+node@18.15.11/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/vite@4.2.1_@types+node@18.15.11/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 commented

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';
  • 👍1
peterhirn commented

@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 commented

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";
}