lz4.jsをブラウザで動かす検証。yarn add lz4-asmなどでライブラリを準備して次のようなコードを書く。

import lz4init from "lz4-asm";

(async () => {
  const { lz4js: lz4 } = await lz4init();
  const x = lz4.compress(new Uint8Array([1, 2, 3, 4, 5, 6, 7, 8]));
  console.log(lz4.decompress(x));
})();

これをWebpackするだけなら問題なくできる。多少の設定は必要ですが。

const path = require("path");

module.exports = {
  entry: "./src/index.js",
  output: {
    filename: "bundle.js",
    path: path.resolve(__dirname, "dist"),
  },
  node: {
    fs: "empty", // node.jsではfs使うがブラウザでは使わないのでemptyにしておく
  },
};

ただ、これだと動作しない。このbundle.jsがwasmを読み込むときfetchしてくるだけなので404になる。単純に要求されたパスにwasmを置くば直る。この場合、dist/_lz4.wasmに置けばok。

ライブラリとしては微妙じゃない?

ただライブラリとして使いたいだけなのにnode_modulesに潜ってwasm引っ張ってくるというのはめんどくさいね。動かないんですけどーっていうIssueが投げられそう。まぁ、これはimport("hoge.wasm")みたいな書き方ができるようになったら解決できるかな。