Stuck at code component registration process

Developer Support
1

I’m now stuck at the component registration process … where/how can I get help ?

2

Hello @aggregate_swan. How can I help you?

3

Hi Icaro.
I don’t know what to do to execute this

image.png

4

I’m using javascript and not typescript so I suppose that I must create a plasmic-init.js file ?

5

Where should I put it ?

6

Are you integrating with an already existing project or are you creating a brand new project?

7

What I have done:

  1. create-react-app
8
  1. Install React Router
9
  1. Synchronise with plasmic project
10
  1. Create the route for /plasmic-host
11
  1. Configure my project with route url
12
  1. Install Material UI library
13

Now I try to register the MUI Components I would like to use in Plasmic Studio

14

All is in Javascript

15

You can register your components inside the plasmic-host file, like this:

// You can register any code components that you want to use here; see
// <https://docs.plasmic.app/learn/code-components-ref/>
// And configure your Plasmic project to use the host url pointing at
// the /plasmic-host page of your nextjs app (for example,
// <http://localhost:3000/plasmic-host>).  See
// <https://docs.plasmic.app/learn/app-hosting/#set-a-plasmic-project-to-use-your-app-host>

// registerComponent(...)

export default function PlasmicHost() {
  return <PlasmicCanvasHost />;
}
16

Is the file already existing ? if yes in which folder ?

17

Oh, inside the route that you created plasmic-host

18

(no content)

19

const root = ReactDOM.createRoot(document.getElementById(‘root’));
root.render(
<React.StrictMode>


<Route path=“/” element={} />
<Route path=“/plasmic-host” element={} />


</React.StrictMode>
);

20

Oooh, sorry.