In Last day i can register the component but today { same code } i can’t register, i check lot of things for register many way, but not working,
their is my code , i am using Next.js , its just hello world project.
builder/init.js :
import { builder, Builder } from '@builder.io/react';
builder.init('f4e3e62004034edb95c31ac80366726e'); // Replace with your Builder.io API key
// // Registering the component
Builder.registerComponent(({ text }) => <h1>{text || 'skajdfh'}</h1>, {
name: 'Gaurav',
inputs: [
{
name: 'text',
type: 'string',
defaultValue: 'gaurav bhai',
},
],
});
console.log('Home component registered with Builder.io');
page.js :
'use client';
import { useEffect, useState } from 'react';
import { BuilderComponent, builder } from '@builder.io/react';
import '../builder/init'; // Import Builder.io initialization
export default function Home() {
const [content, setContent] = useState(null);
// Fetch content from Builder.io on client-side
useEffect(() => {
const fetchContent = async () => {
try {
console.log("Fetching content...");
const contentData = await builder.get('page', { url: '/' });
console.log("Fetched content:", contentData);
setContent(contentData);
} catch (error) {
console.error("Error while fetching content:", error.message);
}
};
fetchContent(); // Calling the async function within useEffect
}, []); // Empty dependency array means this runs once on mount
return (
<div>
{content ? (
<BuilderComponent model="page" content={content} />
) : (
<h1>loading.......</h1>
)}
</div>
);
}
GET API working , but register is not working,
when i checnge inside visual editor than this reflection apply successfully on my localhost, but not vice versa.
lot of refreshes done in visual editor , but dont show registred component,
without typescript…
so if any body faces this problem, so please help me to solve this problem.