EP
Ergo Platform•2y ago
MGpai

This is the error I get

This is the error I get 
error - Error [ERR_MODULE_NOT_FOUND]: Cannot find module '\node_modules\ergo-lib-wasm-browser\ergo_lib_wasm' imported from \.next\server\pages\payment.js
error - Error [ERR_MODULE_NOT_FOUND]: Cannot find module '\node_modules\ergo-lib-wasm-browser\ergo_lib_wasm' imported from \.next\server\pages\payment.js
2 Replies
c8
c8•2y ago
chatgpt suggests: 
npm install next-compose-plugins next-transpile-modules
npm install next-compose-plugins next-transpile-modules
next.config.js 
const withPlugins = require('next-compose-plugins');
const withTM = require('next-transpile-modules')(['ergo-lib-wasm-browser']);

module.exports = withPlugins([withTM], {
  webpack: (config, { isServer }) => {
    // Enable WebAssembly
    config.experiments = { asyncWebAssembly: true, ...config.experiments };

    if (!isServer) {
      // Additional client-side specific configuration if needed
      config.resolve.fallback = { ...config.resolve.fallback, buffer: require.resolve('buffer/') };
    }

    return config;
  },
  // Additional Next.js config options if needed
  webpack5: true, // Ensure Webpack 5 is used
});
const withPlugins = require('next-compose-plugins');
const withTM = require('next-transpile-modules')(['ergo-lib-wasm-browser']);

module.exports = withPlugins([withTM], {
  webpack: (config, { isServer }) => {
    // Enable WebAssembly
    config.experiments = { asyncWebAssembly: true, ...config.experiments };

    if (!isServer) {
      // Additional client-side specific configuration if needed
      config.resolve.fallback = { ...config.resolve.fallback, buffer: require.resolve('buffer/') };
    }

    return config;
  },
  // Additional Next.js config options if needed
  webpack5: true, // Ensure Webpack 5 is used
});
In _app.js or _app.tsx, add the following: 
// _app.js or _app.tsx
import { Buffer } from 'buffer';

if (typeof window !== 'undefined') {
  window.Buffer = Buffer;
}

function MyApp({ Component, pageProps }) {
  return <Component {...pageProps} />;
}

export default MyApp;
// _app.js or _app.tsx
import { Buffer } from 'buffer';

if (typeof window !== 'undefined') {
  window.Buffer = Buffer;
}

function MyApp({ Component, pageProps }) {
  return <Component {...pageProps} />;
}

export default MyApp;
such issues are usually pretty enjoyable to solve with GPT-4o not saying this is correct answer, but few iterations usually get the right answer
MGpai
MGpaiOP•2y ago
thank you I will try it out

Did you find this page helpful?