starter-kit icon indicating copy to clipboard operation
starter-kit copied to clipboard

Fix o1js WASM Load Issue in Next.js by Marking it as External Dependency

Open anarkrypto opened this issue 1 year ago • 0 comments

Description

This PR addresses the issue where the o1js WebAssembly file (plonk_wasm_bg.wasm) could not be found during server-side execution in a Next.js environment, resulting in an "ENOENT: no such file or directory" error. The problem arises because Next.js bundles the o1js code, which implicitly depends on the relative location of the WASM file.

For this reason until now we needed to use dynamic imports like dynamic(() => import("./component"), { ssr: false, }); to import pages and components that depended on zk modules and stores.

With this change this will no longer be necessary.

Changes:

Updated next.config.js to treat o1js as an external dependency during the Webpack build process. This ensures that the o1js code is not bundled by Next.js, but instead loaded directly from node_modules at runtime.

Thanks to @mitschabaude for pointing out the solution https://github.com/o1-labs/o1js/issues/1811#issuecomment-2327125230

anarkrypto avatar Sep 04 '24 01:09 anarkrypto