Using Remote Component with CRA

Hi,

nice library and very well documented, thank you for your effort!

I am having trouble using it within a regular Create React App (without ejecting or rewiring) and would appreciate any advice…

I am getting an error when I start my app:

Module not found: Can't resolve 'remote-component.config.js' in '/path/to/my/app/node_modules/@paciolan/remote-component/dist/lib'

Which later results in: Could not require 'react'. 'react' does not exist in dependencies.

I assume this is because CRA doesn’t use webpack.config.js… Do you maybe know a way around it which would not require ejecting or rewiring the app?

[joelnet]

I updated the docs to include the changes required to get Remote Component working with Create React App.

https://github.com/Paciolan/remote-component#create-react-app

I also made a note about that Warning message that appears.

https://github.com/Paciolan/remote-component#you-may-see-some-warnings

[joelnet]

I was able to get CRA working with the RemoteComponent without using eject.

I followed the manual configuration section.

Some changes I needed to make:

I moved remote-component.config.js into src/remote-component.config.js

Then I create src/components/RemoteComponent.js. I pointed to the new location for src/remote-component.config.js. I also had to change the imports.

/*
 * src/components/RemoteComponent.js
 */
//import {
//  createRemoteComponent,
//  createRequires
//} from "@paciolan/remote-component";
import { createRemoteComponent } from "@paciolan/remote-component/dist/lib/createRemoteComponent";
import { createRequires } from "@paciolan/remote-component/dist/lib/createRequires";
import { resolve } from "../../remote-component.config";

const requires = createRequires(resolve);
export const RemoteComponent = createRemoteComponent({ requires });

The error message seems to be from eager loading of RemoteComponent, even though it’s not used. I’m gonna work on changing this to be lazy in the next version.