I’m using codegen with next.js. But It wrap all my pages with these providers in server component. That doesn’t work on server side. Next.js with app router. How to avoid it?
Could you please explain specifically what doesn’t work on server side and if you are receiving any specific errors?
Thanks
UnnamedGlobalGroupOfVariantsContext, SegmentContext - doesn’t work on server side. I need to move it to layout.tsx or client-page.tsx manually for each pages.
Check your code at page.tsx:35.
⨯ Error: Unsupported Server Component type: undefined
at stringify ()
⨯ Error: Unsupported Server Component type: undefined
at stringify ()
digest: “2163256224”
Could you please share your plasmic.json file so I can review the configuration accordingly.
{
"platform": "nextjs",
"code": {
"lang": "ts",
"scheme": "blackbox",
"reactRuntime": "classic"
},
"style": {
"scheme": "css",
"defaultStyleCssFilePath": "../styles/plasmic__default_style.css"
},
"images": {
"scheme": "public-files",
"publicDir": "../public",
"publicUrlPrefix": "/"
},
"tokens": {
"scheme": "theo",
"tokensFilePath": "plasmic-tokens.theo.json"
},
"srcDir": "./components",
"defaultPlasmicDir": "./plasmic",
"projects": [
{
"projectId": "mi43zEdS25m4jJJB4fWzDF",
"projectName": "LiveArt Web3 Platform | Dev - Vlad",
"version": "latest",
"components": [
{
"id": "z2cNgGnyr5S-",
"name": "CreatorHub",
"type": "managed",
"projectId": "mi43zEdS25m4jJJB4fWzDF",
"renderModuleFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicCreatorHub.tsx",
"importSpec": {
"modulePath": "../app/creatorhub/page.tsx"
},
"cssFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicCreatorHub.css",
"scheme": "blackbox",
"componentType": "page",
"path": "/creatorhub",
"rsc": {
"serverModulePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicCreatorHubServer.tsx",
"clientModulePath": "../app/creatorhub/page-client.tsx"
}
},
{
"id": "qn1mKObfJgwv",
"name": "ArtToken",
"type": "managed",
"projectId": "mi43zEdS25m4jJJB4fWzDF",
"renderModuleFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicArtToken.tsx",
"importSpec": {
"modulePath": "../app/art-token/page.tsx"
},
"cssFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicArtToken.css",
"scheme": "blackbox",
"componentType": "page",
"path": "/art-token",
"rsc": {
"serverModulePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicArtTokenServer.tsx",
"clientModulePath": "../app/art-token/page-client.tsx"
}
},
{
"id": "9CMmwp_HE0o9",
"name": "Dashboard",
"type": "managed",
"projectId": "mi43zEdS25m4jJJB4fWzDF",
"renderModuleFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicDashboard.tsx",
"importSpec": {
"modulePath": "../app/dashboard/page.tsx"
},
"cssFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicDashboard.css",
"scheme": "blackbox",
"componentType": "page",
"path": "/dashboard",
"rsc": {
"serverModulePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicDashboardServer.tsx",
"clientModulePath": "../app/dashboard/page-client.tsx"
}
},
{
"id": "22ZgElETBvB1",
"name": "DigitalArtCollections",
"type": "managed",
"projectId": "mi43zEdS25m4jJJB4fWzDF",
"renderModuleFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicDigitalArtCollections.tsx",
"importSpec": {
"modulePath": "../app/collections-all/page.tsx"
},
"cssFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicDigitalArtCollections.css",
"scheme": "blackbox",
"componentType": "page",
"path": "/collections-all",
"rsc": {
"serverModulePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicDigitalArtCollectionsServer.tsx",
"clientModulePath": "../app/collections-all/page-client.tsx"
}
},
{
"id": "QwrhB3F3onDz",
"name": "CardChenMan01",
"type": "managed",
"projectId": "mi43zEdS25m4jJJB4fWzDF",
"renderModuleFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicCardChenMan01.tsx",
"importSpec": {
"modulePath": "CardChenMan01.tsx"
},
"cssFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicCardChenMan01.css",
"scheme": "blackbox",
"componentType": "component"
},
{
"id": "Fmso8-QbFldQ",
"name": "CardAdamSpizak",
"type": "managed",
"projectId": "mi43zEdS25m4jJJB4fWzDF",
"renderModuleFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicCardAdamSpizak.tsx",
"importSpec": {
"modulePath": "CardAdamSpizak.tsx"
},
"cssFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicCardAdamSpizak.css",
"scheme": "blackbox",
"componentType": "component"
},
{
"id": "7hGWMCArv0qG",
"name": "CardHuangYuxing",
"type": "managed",
"projectId": "mi43zEdS25m4jJJB4fWzDF",
"renderModuleFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicCardHuangYuxing.tsx",
"importSpec": {
"modulePath": "CardHuangYuxing.tsx"
},
"cssFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicCardHuangYuxing.css",
"scheme": "blackbox",
"componentType": "component"
},
{
"id": "3pxJjSOn9YEM",
"name": "XCard",
"type": "managed",
"projectId": "mi43zEdS25m4jJJB4fWzDF",
"renderModuleFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicXCard.tsx",
"importSpec": {
"modulePath": "../app/liveart-pass/page.tsx"
},
"cssFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicXCard.css",
"scheme": "blackbox",
"componentType": "page",
"path": "/liveart-pass",
"rsc": {
"serverModulePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicXCardServer.tsx",
"clientModulePath": "../app/liveart-pass/page-client.tsx"
}
},
{
"id": "PBHeHySu2QNW",
"name": "Terms",
"type": "managed",
"projectId": "mi43zEdS25m4jJJB4fWzDF",
"renderModuleFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicTerms.tsx",
"importSpec": {
"modulePath": "../app/terms/page.tsx"
},
"cssFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicTerms.css",
"scheme": "blackbox",
"componentType": "page",
"path": "/terms",
"rsc": {
"serverModulePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicTermsServer.tsx",
"clientModulePath": "../app/terms/page-client.tsx"
}
},
{
"id": "iOupCkl8E9gk",
"name": "TBuyerRegistration",
"type": "managed",
"projectId": "mi43zEdS25m4jJJB4fWzDF",
"renderModuleFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicTBuyerRegistration.tsx",
"importSpec": {
"modulePath": "../app/buyer-agreement/page.tsx"
},
"cssFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicTBuyerRegistration.css",
"scheme": "blackbox",
"componentType": "page",
"path": "/buyer-agreement",
"rsc": {
"serverModulePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicTBuyerRegistrationServer.tsx",
"clientModulePath": "../app/buyer-agreement/page-client.tsx"
}
},
{
"id": "QfT559myzO5d",
"name": "CreatorhubSection",
"type": "managed",
"projectId": "mi43zEdS25m4jJJB4fWzDF",
"renderModuleFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicCreatorhubSection.tsx",
"importSpec": {
"modulePath": "CreatorhubSection.tsx"
},
"cssFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicCreatorhubSection.css",
"scheme": "blackbox",
"componentType": "component"
},
{
"id": "aFYb5Alr7YuA",
"name": "Partnerwithus",
"type": "managed",
"projectId": "mi43zEdS25m4jJJB4fWzDF",
"renderModuleFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicPartnerwithus.tsx",
"importSpec": {
"modulePath": "Partnerwithus.tsx"
},
"cssFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicPartnerwithus.css",
"scheme": "blackbox",
"componentType": "component"
},
{
"id": "2m6NECQxXpoM",
"name": "TAda",
"type": "managed",
"projectId": "mi43zEdS25m4jJJB4fWzDF",
"renderModuleFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicTAda.tsx",
"importSpec": {
"modulePath": "../app/ada/page.tsx"
},
"cssFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicTAda.css",
"scheme": "blackbox",
"componentType": "page",
"path": "/ada",
"rsc": {
"serverModulePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicTAdaServer.tsx",
"clientModulePath": "../app/ada/page-client.tsx"
}
},
{
"id": "zxvSL8iUidvR",
"name": "CardYmj01",
"type": "managed",
"projectId": "mi43zEdS25m4jJJB4fWzDF",
"renderModuleFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicCardYmj01.tsx",
"importSpec": {
"modulePath": "CardYmj01.tsx"
},
"cssFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicCardYmj01.css",
"scheme": "blackbox",
"componentType": "component"
},
{
"id": "1k_1Wg2BXPSB",
"name": "CardIcaCorey",
"type": "managed",
"projectId": "mi43zEdS25m4jJJB4fWzDF",
"renderModuleFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicCardIcaCorey.tsx",
"importSpec": {
"modulePath": "CardIcaCorey.tsx"
},
"cssFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicCardIcaCorey.css",
"scheme": "blackbox",
"componentType": "component"
},
{
"id": "TX3xog99fA49",
"name": "CardEDigital",
"type": "managed",
"projectId": "mi43zEdS25m4jJJB4fWzDF",
"renderModuleFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicCardEDigital.tsx",
"importSpec": {
"modulePath": "CardEDigital.tsx"
},
"cssFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicCardEDigital.css",
"scheme": "blackbox",
"componentType": "component"
},
{
"id": "5fynuWAc8Irl",
"name": "CardBdWhiteXJpo",
"type": "managed",
"projectId": "mi43zEdS25m4jJJB4fWzDF",
"renderModuleFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicCardBdWhiteXJpo.tsx",
"importSpec": {
"modulePath": "CardBdWhiteXJpo.tsx"
},
"cssFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicCardBdWhiteXJpo.css",
"scheme": "blackbox",
"componentType": "component"
},
{
"id": "VO_-xcyM9la9",
"name": "CardCosmicGold",
"type": "managed",
"projectId": "mi43zEdS25m4jJJB4fWzDF",
"renderModuleFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicCardCosmicGold.tsx",
"importSpec": {
"modulePath": "CardCosmicGold.tsx"
},
"cssFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicCardCosmicGold.css",
"scheme": "blackbox",
"componentType": "component"
},
{
"id": "WGN4hjkOL9l1",
"name": "CardLcoa",
"type": "managed",
"projectId": "mi43zEdS25m4jJJB4fWzDF",
"renderModuleFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicCardLcoa.tsx",
"importSpec": {
"modulePath": "CardLcoa.tsx"
},
"cssFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicCardLcoa.css",
"scheme": "blackbox",
"componentType": "component"
},
{
"id": "-K2iC9J1oUjE",
"name": "CardChenMan2",
"type": "managed",
"projectId": "mi43zEdS25m4jJJB4fWzDF",
"renderModuleFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicCardChenMan2.tsx",
"importSpec": {
"modulePath": "CardChenMan2.tsx"
},
"cssFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicCardChenMan2.css",
"scheme": "blackbox",
"componentType": "component"
},
{
"id": "kPoPnOrKWSHw",
"name": "Button",
"type": "managed",
"projectId": "mi43zEdS25m4jJJB4fWzDF",
"renderModuleFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicButton.tsx",
"importSpec": {
"modulePath": "Button.tsx"
},
"cssFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicButton.css",
"scheme": "blackbox",
"componentType": "component",
"plumeType": "button"
},
{
"id": "d7j9eisy77F7",
"name": "PressImages",
"type": "managed",
"projectId": "mi43zEdS25m4jJJB4fWzDF",
"renderModuleFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicPressImages.tsx",
"importSpec": {
"modulePath": "PressImages.tsx"
},
"cssFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicPressImages.css",
"scheme": "blackbox",
"componentType": "component"
},
{
"id": "-a107e0g3GUW",
"name": "Card",
"type": "managed",
"projectId": "mi43zEdS25m4jJJB4fWzDF",
"renderModuleFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicCard.tsx",
"importSpec": {
"modulePath": "Card.tsx"
},
"cssFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicCard.css",
"scheme": "blackbox",
"componentType": "component"
},
{
"id": "YkDsOtsJI39T",
"name": "Press",
"type": "managed",
"projectId": "mi43zEdS25m4jJJB4fWzDF",
"renderModuleFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicPress.tsx",
"importSpec": {
"modulePath": "../app/press/page.tsx"
},
"cssFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicPress.css",
"scheme": "blackbox",
"componentType": "page",
"path": "/press",
"rsc": {
"serverModulePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicPressServer.tsx",
"clientModulePath": "../app/press/page-client.tsx"
}
},
{
"id": "aH660rPtKRDa",
"name": "Partners",
"type": "managed",
"projectId": "mi43zEdS25m4jJJB4fWzDF",
"renderModuleFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicPartners.tsx",
"importSpec": {
"modulePath": "../app/partners-old/page.tsx"
},
"cssFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicPartners.css",
"scheme": "blackbox",
"componentType": "page",
"path": "/partners-old",
"rsc": {
"serverModulePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicPartnersServer.tsx",
"clientModulePath": "../app/partners-old/page-client.tsx"
}
},
{
"id": "JSXSMGT2CX7y",
"name": "ButtonsYmjPrints",
"type": "managed",
"projectId": "mi43zEdS25m4jJJB4fWzDF",
"renderModuleFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicButtonsYmjPrints.tsx",
"importSpec": {
"modulePath": "ButtonsYmjPrints.tsx"
},
"cssFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicButtonsYmjPrints.css",
"scheme": "blackbox",
"componentType": "component"
},
{
"id": "f_-FcS7ERHkU",
"name": "YueMinjunPrints",
"type": "managed",
"projectId": "mi43zEdS25m4jJJB4fWzDF",
"renderModuleFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicYueMinjunPrints.tsx",
"importSpec": {
"modulePath": "../app/yue-minjun/prints/boundless/page.tsx"
},
"cssFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicYueMinjunPrints.css",
"scheme": "blackbox",
"componentType": "page",
"path": "/yue-minjun/prints/boundless",
"rsc": {
"serverModulePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicYueMinjunPrintsServer.tsx",
"clientModulePath": "../app/yue-minjun/prints/boundless/page-client.tsx"
}
},
{
"id": "nXtnEIsbvYGQ",
"name": "Christies",
"type": "managed",
"projectId": "mi43zEdS25m4jJJB4fWzDF",
"renderModuleFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicChristies.tsx",
"importSpec": {
"modulePath": "../app/partnerships/christies/web3-renaissance-course/page.tsx"
},
"cssFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicChristies.css",
"scheme": "blackbox",
"componentType": "page",
"path": "/partnerships/christies/web3-renaissance-course",
"rsc": {
"serverModulePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicChristiesServer.tsx",
"clientModulePath": "../app/partnerships/christies/web3-renaissance-course/page-client.tsx"
}
},
{
"id": "2WxI1N-qMvCA",
"name": "PrivateSales",
"type": "managed",
"projectId": "mi43zEdS25m4jJJB4fWzDF",
"renderModuleFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicPrivateSales.tsx",
"importSpec": {
"modulePath": "../app/private-sales/page.tsx"
},
"cssFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicPrivateSales.css",
"scheme": "blackbox",
"componentType": "page",
"path": "/private-sales",
"rsc": {
"serverModulePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicPrivateSalesServer.tsx",
"clientModulePath": "../app/private-sales/page-client.tsx"
}
},
{
"id": "embmr9Vb-F9W",
"name": "YmjHuman",
"type": "managed",
"projectId": "mi43zEdS25m4jJJB4fWzDF",
"renderModuleFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicYmjHuman.tsx",
"importSpec": {
"modulePath": "../app/yue-minjun/human/page.tsx"
},
"cssFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicYmjHuman.css",
"scheme": "blackbox",
"componentType": "page",
"path": "/yue-minjun/human",
"rsc": {
"serverModulePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicYmjHumanServer.tsx",
"clientModulePath": "../app/yue-minjun/human/page-client.tsx"
}
},
{
"id": "hIcFAZ3YretP",
"name": "AirDrop",
"type": "managed",
"projectId": "mi43zEdS25m4jJJB4fWzDF",
"renderModuleFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicAirDrop.tsx",
"importSpec": {
"modulePath": "../app/airdrop/page.tsx"
},
"cssFilePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicAirDrop.css",
"scheme": "blackbox",
"componentType": "page",
"path": "/airdrop",
"rsc": {
"serverModulePath": "plasmic/live_art_web_3_platform_dev_vlad/PlasmicAirDropServer.tsx",
"clientModulePath": "../app/airdrop/page-client.tsx"
}
},
]
},
"wrapPagesWithGlobalContexts": false,
"nextjsConfig": {
"pagesDir": "../app"
},
"cliVersion": "0.1.338",
"$schema": "https://unpkg.com/@plasmicapp/cli@0.1.338/dist/plasmic.schema.json"
}
Hi @uladzislau_bairash, I’ve confirmed seeing a similar issue concerning the generated context files (though not the exact same). Do you mind trying to edit the context files and adding the following component, then using <SegmentContextProvider> in place of <SegmentContext.Provider>?
export function SegmentContextProvider(props: React.PropsWithChildren<{
value: SegmentValue | undefined;
}>) {
return (
<SegmentContext.Provider value={props.value}>
{props.children}
</SegmentContext.Provider>
);
}
I believe Next.js introduced this bug recently… Error when using namespace/compound components in React Server Component · Issue #75192 · vercel/next.js · GitHub
Thanks. I did with different approach. I removed this context in generated pages.tsx. And moved it to layout.tsx. But I believe that it will be fixed. Then it will generate automatically without manipulations
Hi @uladzislau_bairash, we have fixed the issue so it works out-of-the-box when you generate now. The context provider component is now generated alongside the context to workaround the Next.js issue.