Browser API depends on webpack

[qgustavor]

I tried importing it using const blake3 = await import('https://unpkg.com/[email protected]/browser.js?module') and it failed with Uncaught ReferenceError: exports is not defined. Seems the code is a mix of ES modules and CommonJS modules.

I also tried importing it using Parcel and it failed with Imports argument must be present and must be an object. Checking this issue seems Parcel's WASM importing behavior is different from webpack's. Then, after, I tried importing it using webpack, it worked.

Is there a way to make it not dependent on webpack behavior?

[connor4312]

Good issue. I didn't bother having an entirely separate, pure ES module tree here like I normally do because wasm is not tree shakable anyway. But I didn't recognize that that would trip up non-Webpack bundlers. Will make a patch release this evening or tomorrow.

[connor4312]

Should be good to go in 2.0.1. ./browser.js now points to an esm build. Let me know if you run into any more problems, happy hashing.

[qgustavor]

I just want to note that making it a ESM build just makes it easier to be imported into browsers without requiring a bundler, in the other hand it don't solves the issue.

The issue is that blake3_js.js imports "blake3_js_bg.wasm" as a ES module and it is not standardized yet, so browsers don't support it and some bundlers handle it in different ways than Webpack.

"blake3_js.js" is generated using wasm-pack and seems it don't support Parcel. You can use --target web, which will create a module that already handles WASM loading without depending on the bundler implementation, but then you need to initialize the module manually.

So seems it's hard to implement without breaking backyards compatibility.

[connor4312]

I'll look into this some more this evening most likely.

[connor4312]

I've fixed this in 8c48e49.

There's now a new import, blake3/browser-async, that exports an function which returns a promise that resolves to the module.

import load from 'blake3/browser-async';

load().then(blake3 => {
  console.log(blake3.hash('hello world'));
});

I expanded the integration tests to test both Webpack and a plain <script type="module"> import.