sanity-io / next-sanity

Sanity.io toolkit for Next.js
https://www.sanity.io/
MIT License
742 stars 90 forks source link

Embedded Sanity displays blank page when using --turbo #1621

Open dmorda opened 1 month ago

dmorda commented 1 month ago

Describe the bug

I'm using Next.js with an embedded Sanity Studio that is accessible at the /studio route. When I use next dev to do local development the studio functions correctly. However, when I use next dev --turbo I get a blank page with no visible errors in the browser console or terminal output.

To Reproduce

  1. Run npx create-next-app next-sanity-starter and go with the defaults as prompted.
  2. Run cd next-sanity-starter.
  3. Run npx sanity init and setup an empty project that uses /studio for the route.
  4. Run npx next dev.
  5. Go to http://localhost:3000/studioand notice that it loads successfully.
  6. Run npx next dev --turbo
  7. Go to http://localhost:3000/studio and notice that it displays a blank page.

Expected behavior

The studio renders the default landing page.

Screenshots studio-error

Which versions of Sanity are you using?

$ sanity versions
@sanity/cli (global)  3.49.0 (latest: 3.52.2)
@sanity/image-url      1.0.2 (up to date)
@sanity/vision        3.52.2 (up to date)
sanity                3.52.2 (up to date)
$ npm list
next-sanity-starter@0.1.0
├── @sanity/image-url@1.0.2
├── @sanity/vision@3.52.2
├── @types/node@20.14.12
├── @types/react-dom@18.3.0
├── @types/react@18.3.3
├── eslint-config-next@14.2.5
├── eslint@8.57.0
├── next-sanity@9.4.2
├── next@14.2.5
├── postcss@8.4.40
├── react-dom@18.3.1
├── react@18.3.1
├── sanity@3.52.2
├── styled-components@6.1.12
├── tailwindcss@3.4.7
└── typescript@5.5.4

What operating system are you using?

macOS Sonoma 14.5

Which versions of Node.js / npm are you running?

$ npm -v && node -v
10.8.2
v20.15.1
saurabhje commented 1 month ago

Hello, can you attach the trace file content? To generate a trace file - .next/trace.log You would have to run this command with Turbo flag - next dev --turbo NEXT_TURBOPACK_TRACING=1

dmorda commented 1 month ago

The trace.log file was about 177MB, so I uploaded it to dropbox since GitHub only supports file uploads up to 25MB.

https://www.dropbox.com/s/mjykfjwu41xts83/trace.log?dl=0

stipsan commented 1 month ago

Hi, could you try the latest canary? npm i next@canary --save-exact 🙌

dmorda commented 1 month ago

Installed next@canary --save-exact and also had to upgrade to React 19 RC. Once I did that I was able to run npm run dev and the Next template website and Sanity Studio worked. However, when I did npx next dev --turbo the Next template website loaded, but the Sanity Studio output a bunch of errors.

⨯ Error: Could not parse module '[project]/node_modules/next/dist/server/route-modules/app-page/vendored/contexts/loadable.js'
    at Object.<anonymous> (/Users/username/Desktop/next-sanity-starter/.next/server/chunks/ssr/node_modules_798a95._.js:162:11)
    at [project]/node_modules/next/dist/server/route-modules/app-page/vendored/contexts/loadable.js [app-rsc] (ecmascript) (/Users/usernam/Desktop/next-sanity-starter/.next/server/chunks/ssr/node_modules_798a95._.js:165:3)
    at instantiateModule (/Users/usernam/Desktop/next-sanity-starter/.next/server/chunks/ssr/[turbopack]_runtime.js:572:23)
    at getOrInstantiateModuleFromParent (/Users/usernam/Desktop/next-sanity-starter/.next/server/chunks/ssr/[turbopack]_runtime.js:624:12)
    at commonJsRequire (/Users/usernam/Desktop/next-sanity-starter/.next/server/chunks/ssr/[turbopack]_runtime.js:146:20)
    at Object.<anonymous> (/Users/usernam/Desktop/next-sanity-starter/.next/server/chunks/ssr/node_modules_798a95._.js:198:73)
    at [project]/node_modules/next/dist/shared/lib/dynamic.js [app-rsc] (ecmascript) (/Users/usernam/Desktop/next-sanity-starter/.next/server/chunks/ssr/node_modules_798a95._.js:299:3)
    at instantiateModule (/Users/usernam/Desktop/next-sanity-starter/.next/server/chunks/ssr/[turbopack]_runtime.js:572:23)
    at getOrInstantiateModuleFromParent (/Users/usernam/Desktop/next-sanity-starter/.next/server/chunks/ssr/[turbopack]_runtime.js:624:12)
    at commonJsRequire (/Users/usernam/Desktop/next-sanity-starter/.next/server/chunks/ssr/[turbopack]_runtime.js:146:20)
    at Object.<anonymous> (/Users/usernam/Desktop/next-sanity-starter/.next/server/chunks/ssr/node_modules_798a95._.js:302:18)
    at [project]/node_modules/next/dynamic.js [app-rsc] (ecmascript) (/Users/usernam/Desktop/next-sanity-starter/.next/server/chunks/ssr/node_modules_798a95._.js:304:3)
    at instantiateModule (/Users/usernam/Desktop/next-sanity-starter/.next/server/chunks/ssr/[turbopack]_runtime.js:572:23)
    at getOrInstantiateModuleFromParent (/Users/usernam/Desktop/next-sanity-starter/.next/server/chunks/ssr/[turbopack]_runtime.js:624:12)
    at esmImport (/Users/usernam/Desktop/next-sanity-starter/.next/server/chunks/ssr/[turbopack]_runtime.js:132:20)
    at /Users/usernam/Desktop/next-sanity-starter/.next/server/chunks/ssr/node_modules_798a95._.js:313:135
    at [project]/node_modules/next-sanity/dist/studio.js [app-rsc] (ecmascript) <locals> (/Users/usernam/Desktop/next-sanity-starter/.next/server/chunks/ssr/node_modules_798a95._.js:331:3)
    at instantiateModule (/Users/usernam/Desktop/next-sanity-starter/.next/server/chunks/ssr/[turbopack]_runtime.js:572:23)
    at getOrInstantiateModuleFromParent (/Users/usernam/Desktop/next-sanity-starter/.next/server/chunks/ssr/[turbopack]_runtime.js:624:12)
    at esmImport (/Users/usernam/Desktop/next-sanity-starter/.next/server/chunks/ssr/[turbopack]_runtime.js:132:20)
    at /Users/usernam/Desktop/next-sanity-starter/.next/server/chunks/ssr/[root of the server]__91df1f._.js:118:168
    at [project]/app/studio/[[...tool]]/page.tsx [app-rsc] (ecmascript) <locals> (/Users/usernam/Desktop/next-sanity-starter/.next/server/chunks/ssr/[root of the server]__91df1f._.js:136:3)
    at instantiateModule (/Users/usernam/Desktop/next-sanity-starter/.next/server/chunks/ssr/[turbopack]_runtime.js:572:23)
    at getOrInstantiateModuleFromParent (/Users/usernam/Desktop/next-sanity-starter/.next/server/chunks/ssr/[turbopack]_runtime.js:624:12)
    at esmImport (/Users/usernam/Desktop/next-sanity-starter/.next/server/chunks/ssr/[turbopack]_runtime.js:132:20)
    at /Users/usernam/Desktop/next-sanity-starter/.next/server/chunks/ssr/[root of the server]__91df1f._.js:143:164
    at [project]/app/studio/[[...tool]]/page.tsx [app-rsc] (ecmascript) <module evaluation> (/Users/usernam/Desktop/next-sanity-starter/.next/server/chunks/ssr/[root of the server]__91df1f._.js:146:3)
    at instantiateModule (/Users/usernam/Desktop/next-sanity-starter/.next/server/chunks/ssr/[turbopack]_runtime.js:572:23)
    at getOrInstantiateModuleFromParent (/Users/usernam/Desktop/next-sanity-starter/.next/server/chunks/ssr/[turbopack]_runtime.js:624:12)
    at esmImport (/Users/usernam/Desktop/next-sanity-starter/.next/server/chunks/ssr/[turbopack]_runtime.js:132:20)
    at /Users/usernam/Desktop/next-sanity-starter/.next/server/chunks/ssr/[root of the server]__91df1f._.js:170:176
    at [project]/app/studio/[[...tool]]/page.tsx [app-rsc] (ecmascript) <facade> (/Users/usernam/Desktop/next-sanity-starter/.next/server/chunks/ssr/[root of the server]__91df1f._.js:174:3)
    at instantiateModule (/Users/usernam/Desktop/next-sanity-starter/.next/server/chunks/ssr/[turbopack]_runtime.js:572:23)
    at getOrInstantiateModuleFromParent (/Users/usernam/Desktop/next-sanity-starter/.next/server/chunks/ssr/[turbopack]_runtime.js:624:12)
    at esmImport (/Users/usernam/Desktop/next-sanity-starter/.next/server/chunks/ssr/[turbopack]_runtime.js:132:20)
    at /Users/usernam/Desktop/next-sanity-starter/.next/server/chunks/ssr/[root of the server]__91df1f._.js:177:32
    at [project]/app/studio/[[...tool]]/page.tsx [app-rsc] (ecmascript, Next.js server component) <facade> (/Users/usernam/Desktop/next-sanity-starter/.next/server/chunks/ssr/[root of the server]__91df1f._.js:179:3)
    at instantiateModule (/Users/usernam/Desktop/next-sanity-starter/.next/server/chunks/ssr/[turbopack]_runtime.js:572:23)
    at getOrInstantiateModuleFromParent (/Users/usernam/Desktop/next-sanity-starter/.next/server/chunks/ssr/[turbopack]_runtime.js:624:12)
    at esmImport (/Users/usernam/Desktop/next-sanity-starter/.next/server/chunks/ssr/[turbopack]_runtime.js:132:20)
    at /Users/usernam/Desktop/next-sanity-starter/.next/server/chunks/ssr/node_modules_798a95._.js:3848:199
    at [project]/node_modules/next/dist/esm/build/templates/app-page.js?page=/studio/[[...tool]]/page { COMPONENT_0 => "[project]/app/layout.tsx [app-rsc] (ecmascript, Next.js server component)", COMPONENT_1 => "[project]/node_modules/next/dist/client/components/not-found-error.js [app-rsc] (ecmascript, Next.js server component)", COMPONENT_2 => "[project]/app/studio/[[...tool]]/page.tsx [app-rsc] (ecmascript, Next.js server component) <facade>" } [app-rsc] (ecmascript) <module evaluation> (/Users/usernam/Desktop/next-sanity-starter/.next/server/chunks/ssr/node_modules_798a95._.js:3856:3)
    at instantiateModule (/Users/usernam/Desktop/next-sanity-starter/.next/server/chunks/ssr/[turbopack]_runtime.js:572:23)
    at getOrInstantiateModuleFromParent (/Users/usernam/Desktop/next-sanity-starter/.next/server/chunks/ssr/[turbopack]_runtime.js:624:12)
    at esmImport (/Users/usernam/Desktop/next-sanity-starter/.next/server/chunks/ssr/[turbopack]_runtime.js:132:20)
    at /Users/usernam/Desktop/next-sanity-starter/.next/server/chunks/ssr/node_modules_798a95._.js:4004:796
    at [project]/node_modules/next/dist/esm/build/templates/app-page.js?page=/studio/[[...tool]]/page { COMPONENT_0 => "[project]/app/layout.tsx [app-rsc] (ecmascript, Next.js server component)", COMPONENT_1 => "[project]/node_modules/next/dist/client/components/not-found-error.js [app-rsc] (ecmascript, Next.js server component)", COMPONENT_2 => "[project]/app/studio/[[...tool]]/page.tsx [app-rsc] (ecmascript, Next.js server component) <facade>" } [app-rsc] (ecmascript) <facade> (/Users/usernam/Desktop/next-sanity-starter/.next/server/chunks/ssr/node_modules_798a95._.js:4008:3)
    at instantiateModule (/Users/usernam/Desktop/next-sanity-starter/.next/server/chunks/ssr/[turbopack]_runtime.js:572:23)
    at instantiateRuntimeModule (/Users/usernam/Desktop/next-sanity-starter/.next/server/chunks/ssr/[turbopack]_runtime.js:632:12)
    at Object.getOrInstantiateRuntimeModule (/Users/usernam/Desktop/next-sanity-starter/.next/server/chunks/ssr/[turbopack]_runtime.js:647:12) {
  code: 'MODULE_UNPARSEABLE',
  page: '/studio'
}

I've also attached a screenshot of the error. CleanShot 2024-08-06 at 20 24 48

afullsnack commented 2 weeks ago

Currently getting the same issue with next 15-rc and react 19-rc, when using --turbo flag with next dev command, has it been confirmed to be a compatibility issue with the turbo build system in next? and is there a fix?

dohooo commented 1 week ago

Same problem. Any updates? more details