warp-contracts/warp

[BUG] NextJS 13 App Router Support

Closed this issue · 1 comments

codingwithmanny commented

Describe the bug
The new default for NextJS 13 app router, warp doesn't seem to be supported server-side on api endpoints.
It is however supported in NextJS 13 page router, but app router is now the default recommended by NextJS.

To Reproduce

  1. Clone the following repository https://github.com/codingwithmanny/nextjs-approuter-warp
  2. Install dependencies and run npm run dev
  3. Go to http://localhost/api/arweave in the browser and see errors

Expected behavior

  • To return state of contract.

Screenshots
Screenshot 2023-08-04 at 10 50 24 PM

Desktop (please complete the following information):

  • OS: Mac OS Ventura
  • Node.js 18.15.0
  • warp-contracts SDK v1.4.14
  • warp-contracts plugins being used (+ versions)
  • Browser N/A API Endpoint

Additional context
Here is the error log:

- error node_modules/node-gyp-build/node-gyp-build.js (60:8) @ load.resolve.load.path
- error Error: No native build was found for platform=darwin arch=arm64 runtime=node abi=108 uv=1 armv=8 libc=glibc node=18.16.1 webpack=true
    loaded from: /path/to/nextjs-approuter-warp/.next/server/app/api/arweave

    at load.resolve.load.path (webpack-internal:///(rsc)/./node_modules/node-gyp-build/node-gyp-build.js:50:11)
    at load (webpack-internal:///(rsc)/./node_modules/node-gyp-build/node-gyp-build.js:20:32)
    at eval (webpack-internal:///(rsc)/./node_modules/classic-level/binding.js:2:107)
    at (rsc)/./node_modules/classic-level/binding.js (/path/to/nextjs-approuter-warp/.next/server/app/api/arweave/route.js:1001:1)
    at __webpack_require__ (/path/to/nextjs-approuter-warp/.next/server/webpack-runtime.js:33:43)
    at eval (webpack-internal:///(rsc)/./node_modules/classic-level/index.js:6:17)
    at (rsc)/./node_modules/classic-level/index.js (/path/to/nextjs-approuter-warp/.next/server/app/api/arweave/route.js:1023:1)
    at __webpack_require__ (/path/to/nextjs-approuter-warp/.next/server/webpack-runtime.js:33:43)
    at eval (webpack-internal:///(rsc)/./node_modules/level/index.js:1:17)
    at (rsc)/./node_modules/level/index.js (/path/to/nextjs-approuter-warp/.next/server/app/api/arweave/route.js:1143:1)
    at __webpack_require__ (/path/to/nextjs-approuter-warp/.next/server/webpack-runtime.js:33:43)
    at eval (webpack-internal:///(rsc)/./node_modules/warp-contracts/lib/cjs/cache/impl/LevelDbCache.js:7:17)
    at (rsc)/./node_modules/warp-contracts/lib/cjs/cache/impl/LevelDbCache.js (/path/to/nextjs-approuter-warp/.next/server/app/api/arweave/route.js:2726:1)
    at __webpack_require__ (/path/to/nextjs-approuter-warp/.next/server/webpack-runtime.js:33:43)
    at eval (webpack-internal:///(rsc)/./node_modules/warp-contracts/lib/cjs/index.js:33:14)
    at (rsc)/./node_modules/warp-contracts/lib/cjs/index.js (/path/to/nextjs-approuter-warp/.next/server/app/api/arweave/route.js:3254:1)
    at __webpack_require__ (/path/to/nextjs-approuter-warp/.next/server/webpack-runtime.js:33:43)
    at eval (webpack-internal:///(rsc)/./src/app/api/arweave/route.ts:6:72)
    at (rsc)/./src/app/api/arweave/route.ts (/path/to/nextjs-approuter-warp/.next/server/app/api/arweave/route.js:3452:1)
    at __webpack_require__ (/path/to/nextjs-approuter-warp/.next/server/webpack-runtime.js:33:43)
    at eval (webpack-internal:///(rsc)/./node_modules/next/dist/build/webpack/loaders/next-app-loader.js?name=app%2Fapi%2Farweave%2Froute&page=%2Fapi%2Farweave%2Froute&appPaths=&pagePath=private-next-app-dir%2Fapi%2Farweave%2Froute.ts&appDir=%2FUsers%2Fmanny%2FDocuments%2Fgithub%2Fnextjs-warp%2Fsrc%2Fapp&pageExtensions=tsx&pageExtensions=ts&pageExtensions=jsx&pageExtensions=js&rootDir=%2FUsers%2Fmanny%2FDocuments%2Fgithub%2Fnextjs-warp&isDev=true&tsconfigPath=tsconfig.json&basePath=&assetPrefix=&nextConfigOutput=&preferredRegion=&middlewareConfig=e30%3D!:15:128)
    at (rsc)/./node_modules/next/dist/build/webpack/loaders/next-app-loader.js?name=app%2Fapi%2Farweave%2Froute&page=%2Fapi%2Farweave%2Froute&appPaths=&pagePath=private-next-app-dir%2Fapi%2Farweave%2Froute.ts&appDir=%2FUsers%2Fmanny%2FDocuments%2Fgithub%2Fnextjs-warp%2Fsrc%2Fapp&pageExtensions=tsx&pageExtensions=ts&pageExtensions=jsx&pageExtensions=js&rootDir=%2FUsers%2Fmanny%2FDocuments%2Fgithub%2Fnextjs-warp&isDev=true&tsconfigPath=tsconfig.json&basePath=&assetPrefix=&nextConfigOutput=&preferredRegion=&middlewareConfig=e30%3D! (/path/to/nextjs-approuter-warp/.next/server/app/api/arweave/route.js:286:1)
    at __webpack_require__ (/path/to/nextjs-approuter-warp/.next/server/webpack-runtime.js:33:43)
    at __webpack_exec__ (/path/to/nextjs-approuter-warp/.next/server/app/api/arweave/route.js:3715:39)
    at /path/to/nextjs-approuter-warp/.next/server/app/api/arweave/route.js:3716:28
    at Object.<anonymous> (/path/to/nextjs-approuter-warp/.next/server/app/api/arweave/route.js:3719:3)
    at Module._compile (node:internal/modules/cjs/loader:1256:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1310:10)
    at Module.load (node:internal/modules/cjs/loader:1119:32)
    at Module._load (node:internal/modules/cjs/loader:960:12)
    at Module.require (node:internal/modules/cjs/loader:1143:19)
    at require (node:internal/modules/cjs/helpers:110:18)
    at requirePage (/path/to/nextjs-approuter-warp/node_modules/next/dist/server/require.js:112:75)
    at /path/to/nextjs-approuter-warp/node_modules/next/dist/server/load-components.js:80:84
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async loadComponentsImpl (/path/to/nextjs-approuter-warp/node_modules/next/dist/server/load-components.js:80:26)
    at async DevServer.findPageComponentsImpl (/path/to/nextjs-approuter-warp/node_modules/next/dist/server/next-server.js:772:36) {
  digest: undefined
}
null
Tadeuchi commented

Hi @codingwithmanny,
thanks very much for very detailed description.
I reproduced the problem. It seems to be caused by classic-level...

I removed warp and I tried just using classic-level in route.ts.
import { ClassicLevel } from 'classic-level'; const db = new ClassicLevel('./db', { valueEncoding: 'json' })
Got the same error

  • error node_modules/node-gyp-build/node-gyp-build.js (60:8) @ load.resolve.load.path

  • error Error: No native build was found for platform=darwin arch=arm64 runtime=node abi=108 uv=1 armv=8 libc=glibc node=18.14.0 webpack=true
    loaded from: /Users/taadeuszwl/IdeaProjects/warp-contracts/nextjs-approuter-warp/.next/server/app/api/arweave

    at load.resolve.load.path (webpack-internal:///(rsc)/./node_modules/node-gyp-build/node-gyp-build.js:50:11)
    at load (webpack-internal:///(rsc)/./node_modules/node-gyp-build/node-gyp-build.js:20:32)
    at eval (webpack-internal:///(rsc)/./node_modules/classic-level/binding.js:2:107)

I even found an issue on classic-level project
Level/classic-level#82