Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

RSC Example doesn't work #2976

Open
rickiesmooth opened this issue Jun 5, 2024 · 6 comments
Open

RSC Example doesn't work #2976

rickiesmooth opened this issue Jun 5, 2024 · 6 comments

Comments

@rickiesmooth
Copy link

Bug report

The RSC example from the examples folder doesn't work.

Description / Observed Behavior

The RSC example as is, throws an error when running it.
When I await the request (const serverData = fetcher('http://localhost:3000/api/data') in page.jsx it does works.

Expected Behavior

I expect being able run the example without having to await the promise in the page component.

Repro Steps / Code Example

I cloned the RSC example
run yarn install
run yarn run dev
navigate to localhost:3000/rsc
I see TypeError: data.map is not a function.

Additional Context

SWR version: 2.2.5

@koba04
Copy link
Collaborator

koba04 commented Jun 5, 2024

You can run this example with pnpm dev.

@rickiesmooth
Copy link
Author

I'm probably doing something run, but when I run it with pnpm dev I still get the same issue.

@rickiesmooth
Copy link
Author

weird, I've also tried to "One-Click Deploy" this suspense example, and get the same error during build:

CleanShot 2024-06-05 at 17 35 28@2x

@koba04
Copy link
Collaborator

koba04 commented Jun 5, 2024

You might still use the latest version of SWR; the example depends on the feature that is contained in the beta versions.
Did you clean your deps (node_modules/) and run pnpm install and pnpm build on the root before running the app?

weird, I've also tried to "One-Click Deploy" this suspense example, and get the same error during build:

Yeah, this example points to the latest version of SWR, so this won't work.
https://github.com/vercel/swr/blob/main/examples/suspense/package.json#L10
I expect this will work after you update the version to "beta."

@koba04
Copy link
Collaborator

koba04 commented Jun 5, 2024

CONTRIBUTING.md will also help you.

@rickiesmooth
Copy link
Author

rickiesmooth commented Jun 5, 2024

Thanks for explaining! I've updated the package.json to use "beta" but that causes this error:

Packages:  24
                        
Progress: resolved 32, reused 19, downloaded 5, added 24, done

dependencies:
  next 14.2.3
  react 18.3.1
  react-dom 18.3.1
  swr 2.2.6-beta.4

Done in 3.1s
➜  suspense pnpm build  

> [email protected] build /Users/Dev/suspense
> next build

  ▲ Next.js 14.2.3

   Creating an optimized production build ...
 ✓ Compiled successfully
 ✓ Linting and checking validity of types    
   Collecting page data  ..file:///Users/Dev/suspense/node_modules/.pnpm/[email protected][email protected]/node_modules/swr/dist/_internal/index.mjs:1
import { i as isWindowDefined, a as isFunction, m as mergeObjects, S as SWRConfigContext, d as defaultConfig, s as serialize, b as SWRGlobalState, c as cache, e as isUndefined, f as mergeConfigs } from './config-context-client-Ds68J9M9.js';
                                                                   ^
SyntaxError: Named export 'S' not found. The requested module './config-context-client-Ds68J9M9.js' is a CommonJS module, which may not support all module.exports as named exports.
CommonJS modules can always be imported via the default export, for example using:

import pkg from './config-context-client-Ds68J9M9.js';
const { i: isWindowDefined, a: isFunction, m: mergeObjects, S: SWRConfigContext, d: defaultConfig, s: serialize, b: SWRGlobalState, c: cache, e: isUndefined, f: mergeConfigs } = pkg;

    at ModuleJob._instantiate (node:internal/modules/esm/module_job:132:21)
    at async ModuleJob.run (node:internal/modules/esm/module_job:214:5)
    at async ModuleLoader.import (node:internal/modules/esm/loader:329:24)
    at async importModuleDynamicallyWrapper (node:internal/vm/module:431:15)

> Build error occurred
Error: Failed to collect page data for /
    at /Users/Dev/suspense/node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/next/dist/build/utils.js:1268:15 {
  type: 'Error'
}
   Collecting page data  . ELIFECYCLE  Command failed with exit code 1.

I am able to run the rsc example now though

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants