Description
What's not working?
Building and then serving was not working when trying React Server Components. I am writing an article on this on a deadline, so I actually got it running by editing files in the node modules.
Here is how I fixed it:
This is the step where I ran into this error:
".../client-build-manifest.json" needs an import assertion of type "json"
It actually had me upgrading yarn, breaking everything for a while, giving up, and finally reading the errors in detail and grepping through the project files. The error came from the vite
package at the rscBuildRwEnvVars
step of building. It pointed to line 44 in /node_modules/@redwoodjs/vite/dist/buildRouteManifest.js
, which looked like this:
const clientBuildManifest = (await import(buildManifestUrl, { with: { type: "json" } })).default;
I just kind of guessed and changed with
to assert
:
const clientBuildManifest = (await import(buildManifestUrl, { assert: { type: "json" } })).default;
And that fixed the build error. When I tried to serve the app, I ran into the same error there. Since I figured it was the same issue, I grepped for the incorrect import:
grep -rl "with: { type: " ./redwood_rsc_app
And found two in ./redwood_rsc_app/node_modules/@redwoodjs/vite/dist/runFeServer.js
and replaced with
with assert
on line 68 and line 72 of that file.
And the project finally ran. I have never had a guess pan out so well.
How do we reproduce the bug?
npx -y create-redwood-app@canary -y redwood_rsc_app
yarn install
yarn rw experimental setup-streaming-ssr -f
yarn rw experimental setup-rsc
yarn rw build
yarn rw serve
What's your environment? (If it applies)
System:
OS: macOS 14.4.1
Shell: 3.6.1 - /opt/homebrew/bin/fish
Binaries:
Node: 20.3.0 - /private/var/folders/2c/jc8wvk991kl9vlzf5y1ryghc0000gp/T/xfs-2b4c42a7/node
Yarn: 4.1.1 - /private/var/folders/2c/jc8wvk991kl9vlzf5y1ryghc0000gp/T/xfs-2b4c42a7/yarn
Databases:
SQLite: 3.43.2 - /usr/bin/sqlite3
Browsers:
Chrome: 124.0.6367.62
Edge: 124.0.2478.51
Safari: 17.4.1
npmPackages:
@redwoodjs/core: 8.0.0-canary.496 => 8.0.0-canary.496+7370e8fe4
@redwoodjs/project-config: 8.0.0-canary.496 => 8.0.0-canary.496+7370e8fe4
Are you interested in working on this?
- I'm interested in working on this