1

I am following the documentation to bring and register a react component and reuse it in Sitecore component editor. https://doc.sitecore.com/xmc/en/developers/jss/latest/jss-xmc/walkthrough--registering-an-external-react-component.html

I was able to register the component successfully in the Sitecore

enter image description here

And it shows in the component section as well

enter image description here

But once I drag and drop it to the editor it gives me this error

enter image description here

What are the exact steps that I need to follow from the Sitecore side in order to BYOC approach in sitecore. I have already created a data Template.I need to know the next steps(Like creating a rendering)in order to make this work properly. Not sure where to create rendering for BYOC. And not sure about this BYOC wrapper and FEaaS wrapper.

enter image description here

1
  • Comments have been moved to chat; please do not continue the discussion here. Before posting a comment below this one, please review the purposes of comments. Comments that do not request clarification or suggest improvements usually belong as an answer, on Sitecore Meta, or in Sitecore Chat. Comments continuing discussion may be removed.
    – Richard Seal
    Commented Feb 13 at 13:20

3 Answers 3

1

Hi @lahiru Lanka Rathnayka,

As you see in below screenshot enter image description here

You are able to drag and drop because its available in Sitecore, but corresponding named component on react site is missing.

And that also means that components like "FeaasWrapper","BYOCWrapper" are not created by us (developers), but those are features of XM Cloud to be able to work with FeaaS and BYOC features.

In your code repo those components are missing, so you will need to update your repo in order to have those components flow into your repo and then your XM Cloud instance will be pointing to latest rendering host and then you should be able to get it working.

I have had same issues, but after having a latest code, it just works.

1

Make sure that your web application includes the ./byoc folder with the implementation of the BYOC component in it.

If its not there, you will need to upgrade your JSS to the latest (21.6 at the time of writing) and update your web application to match the latest changes in the XM Cloud Foundation Head Starter Kit.

-1

The reason for this error is you have not yet mapped a component to this JSON rendering in your rendering host.

See the document for more details where the error is given.

https://doc.sitecore.com/xp/en/developers/hd/19/sitecore-headless-development/walkthrough--creating-a-new-component-in-a-jss-next-js-app-using-the-sitecore-first-development-workflow.html

So you need to verify your component name matches your next js component name.

Follow this to verify your implementation of your component.

https://www.vinayjadav.com/posts/sitecore-jss-nextjs-create-first-component

I would also recommend you match your new component with an existing one, which will help you more to identify the root cause.

Hope this helps.

1
  • 1
    The OP is using BYOC - not a standard XM component
    – Richard Seal
    Commented Feb 12 at 16:27

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.