This Gist works for CRA 3. For CRA 4, you can try community maintained craco plugin for converting to a single-spa application at https://github.com/hasanayan/craco-plugin-single-spa-application (thanks @hasanayan):
- Install react-app-rewired, as explained in https://github.com/timarney/react-app-rewired.
- Create a file in src called
single-spa-entry.js
(or tsx for typescript) - Modify config-overrides.js, as shown in the config-overrides.js file provided in this gist.
- (Optional) remove src/main.js, since single-spa-entry is the new entry
- (Optional) remove public/index.html, since single-spa applications share a single html file, instead of one html file per project.
For cors, you need to add the access-control-allow-origin header. I'll update the original gist with this
Reference at https://github.com/single-spa/create-single-spa/blob/d73aafb1b38df0ced8e98016ef5df9c9dfae9ef3/packages/webpack-config-single-spa/lib/webpack-config-single-spa.js#L70-L73