How to use buffer in my nextjs

[18121A05L2]

Summary

I was build a project based on Zeroknowledge proofs

for that i need to use @aztec/bb.js package in my frontend

but i was facing the following error buf.writeBigUInt64BE is not a function

for this i have tried to modify my nexjs config file to the below , but still i was facing that issue

import type { NextConfig } from "next";
import webpack from "webpack"; // Import webpack

const nextConfig: NextConfig = {
  webpack: (config, { isServer }) => {
    if (!isServer) {
      config.resolve.fallback = {
        ...config.resolve.fallback, // Preserve existing fallbacks
        buffer: require.resolve("buffer"),
      };

      config.plugins.push(
        new webpack.ProvidePlugin({
          Buffer: ["buffer", "Buffer"],
        })
      );
    }

    return config;
  },
};

export default nextConfig;

Additional information

No response

Example

[icyJoseph]

I see, IIRC, for client/browser code, this buffer is used https://github.com/feross/buffer to have node/browser compatibility, and as this issue points out, feross/buffer#318, Buffer.prototype.writeBigUInt64BE is undefined in that implementation. The issue also points out at the chain of imports IIRC.

You could polyfill the missing support for BigInt I guess, or change to try to keep the usage of this API server side exclusive -