Let's say you have a NextJS page that uses React Server Components (RSC) and you have to use the async
keyword when exporting that page
// app/page.js
export default async function Home() {
const { clients } = await getHomeContent()
// ...code that displays clients cards on the home page
}
If you try to import this component/page into Storybook 8, you will get this error:
async/await is not yet supported in Client Components, only Server Components
To get around it, simply enable the experimentalRSC
flag on .storybook/main.js
/** @type { import('@storybook/nextjs').StorybookConfig } */
const config = {
features: {
experimentalRSC: true,
},
// ...other configs
}
export default config
Read more about it here:
https://storybook.js.org/blog/storybook-react-server-components/