2

I'm working on a single-spa React version 5.9.4, which currently it is configured with react 17. But when I try to update to React 18, it doesn't recognize the createRoot method from DOMClient, which is set up like this:

react-mf-hello-world.tsx file

import React from 'react';
import * as ReactDOMClient from 'react-dom/client';
import singleSpaReact from 'single-spa-react';

import Root from './root.component';

const lifecycles = singleSpaReact({
  React,
  ReactDOMClient,
  rootComponent: Root,
  // eslint-disable-next-line @typescript-eslint/no-unused-vars
  errorBoundary(err, info, props) {
    // Customize the root error boundary for your microfrontend here.
    return null;
  },
});
export const { bootstrap, mount, unmount } = lifecycles;

And this is the error I'm getting:

console

*Even though I have configured React 18, it's using the render method, so it behaves like React 17.

** Uncaught TypeError: application '@react-mf/hello-world' died in status SKIP_BECAUSE_BROKEN: m.createRoot is not a function**

versions dependencies of my proyect:

  • react 18.2.0
  • react-dom 18.2.0
  • single-spa 5.9.4
  • single-spa-react 5.0.0
  • webpack 5.75.0

Any help is greatly appreciated!

Sabrina Lucero
  • 31
  • 6

1 Answers1

1

I was able to solve it! The problem was that I needed to update the cdn react version of the root project of my single spa.

Sabrina Lucero
  • 31
  • 6