Error when compiling next js project after importing OpenSeaPort

[kseikyo]

Steps to reproduce

1. Create a brand new project with yarn create next-app, npx create-next-app@latest, or pnpm dlx create-next-app@latest
2. Using your package manager of choice, add opensea-js
3. Open pages/index.js
4. Add this import import { OpenSeaPort } from "opensea-js";
5. Save and run the project

OS: Garuda Linux x86_64 Kernel: 5.16.10-zen1-1-zen Node version: v16.13.2

Stack trace

error - ./node_modules/rustbn.js/lib/index.asm.js:1:1279
Module not found: Can't resolve 'fs'

Import trace for requested module:
./node_modules/rustbn.js/index.js
./node_modules/ethereumjs-vm/dist/evm/precompiles/06-ecadd.js
./node_modules/ethereumjs-vm/dist/evm/precompiles/index.js
./node_modules/ethereumjs-vm/dist/evm/evm.js
./node_modules/ethereumjs-vm/dist/runCode.js
./node_modules/ethereumjs-vm/dist/index.js
./node_modules/@0x/base-contract/lib/src/index.js
./node_modules/wyvern-js/lib/abi_gen/wyvern_d_a_o.js
./node_modules/wyvern-js/lib/wyvernProtocol.js
./node_modules/wyvern-js/lib/index.js
./node_modules/opensea-js/lib/seaport.js
./node_modules/opensea-js/lib/index.js

[SMLaursen]

Same issue here. OpenSea-js 2.0.1 didn't have this issue.

[zackbiernat]

Adding this to the next.config.js fixed the compile error for us

    future: {
        webpack5: true,
    },
    webpack: (config, {}) => {
        config.resolve.fallback = {
            ...config.resolve.fallback,
            fs: false,
          };
     },

but we still get a bunch of critical dependency errors in the console.

[kseikyo]

Adding this to the next.config.js fixed the compile error for us

    future: {
        webpack5: true,
    },
    webpack: (config, {}) => {
        config.resolve.fallback = {
            ...config.resolve.fallback,
            fs: false,
          };
     },

but we still get a bunch of critical dependency errors in the console.

Thank you, but I was aware of the possible workarounds.

I created the issue as an SDK shouldn't need a workaround just to use it. but this project seems abandoned when it comes to issues and PRs anyway 😔

[Monte9]

I ran into this issue as well on our project. The workaround suggested by @zackbiernat worked for us in our Next.JS app. Hopefully someone from OS team will take a look at this and put in a fix!

[esteban-OpenSea]

We are looking into this!

[teawaterwire]

issue also happening when compiling for Cloudflare workers

[Priyanshu1609]

Yes, I am also facing the same issue. Please fix this.

[ghostza1209]

I'm also facing the same problem in laravel vue when compiling

[tudormunteanu]

In case folks are wondering where the snippet from @zackbiernat actually fits, please see: https://stackoverflow.com/a/67478653/111804

[esteban-OpenSea]

Hi everyone, I wanted to follow up on this. Just curious, is this still happening when using the latest version of node and the sdk?

[SMLaursen]

Hi everyone, I wanted to follow up on this. Just curious, is this still happening when using the latest version of node and the sdk?

I still got this issue on OpenSea-js 4.0.1 and Node 16.15.1- https://github.com/ProjectOpenSea/opensea-js/issues/421#issuecomment-1061214437 still applies

[Blizard]

Hi everyone, I wanted to follow up on this. Just curious, is this still happening when using the latest version of node and the sdk?

I still got this issue on OpenSea-js 4.0.1 and Node 16.15.1- #421 (comment) still applies

Same for me...

[MuhammadMinhaj]

Adding this to the next.config.js fixed the compile error for us

    future: {
        webpack5: true,
    },
    webpack: (config, {}) => {
        config.resolve.fallback = {
            ...config.resolve.fallback,
            fs: false,
          };
     },

but we still get a bunch of critical dependency errors in the console.

Thank you. it worked. Don't forget to return the Config object from the Webpack method. Use dynamic import when a server error occurs in NextJS.

[github-actions[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed in 14 days if no further activity occurs. Thank you for your contributions. If you believe this was a mistake, please comment.