Failure Setting up Remote for different app to run content for an external app

Hello teammates, am experiencing a certain error that needs to be fixed within micro-frontend setup : Here is the Error I face : Error Problem .

I tried setting up the remote as shown below :
remte

I also made App.jsx were the Error seems to originate from as below app

cc: @dkayiwa @kdaud @jwnasambu @EveryOne Thanks

You need to have Webpack setup to use a compiler that understands how to transform JSX; hence, the error you’re getting: "Support for the experimental syntax 'jsx' isn't currently enabled". In the error message, there’s a suggestion for how you can do so using Babel.

Great idea brother @ibacher , how can I set it up with Babel to get work done

as @ibacher said, your error points out a solution; you need to add the @babel/preset-react preset to your Babel configuration.

To do this, you will need to install it using npm or yarn:

npm install @babel/preset-react

or

yarn add @babel/preset-react

Then, in your Babel configuration file, you need to add @babel/preset-react to the list of presets:

{

“presets”: [“@babel/preset-react”]

}

try re-running your build and see if the error has been resolved.

@dkigen @vasharma05 @jnsereko

3 Likes

I really appreciate your great explanation @thembo42 am working at it right now , am to notify for any need of assistance thanks in advance .

1 Like

Am :grinning: happy to say that every thing works now I also created a babel.config.js file then placed in this content :

module.exports = {
    presets:[
        "@babel/preset-env",
        "@babel/preset-react"
    ]
}

appreciate for your support @thembo42 @ibacher