Skip to content

User live reload development server from external application #4210

Closed
@sethreidnz

Description

@sethreidnz

Is this a bug report?

No

Concept

I have a site where I would like to use create-react-app, it basically is perfect for what I need. However the issue is that I need to load the React app from within a legacy application that is going to render all a lot of the HTML for the site. I am trying to do this by doing some code splitting and having specific divs to load specific components. Somewhat like so:

const dashboardMountNode = document.getElementById('react_dashboard');
if (dashboardMountNode) {
  import("./client/Dashboard").then(({ default: Dashboard }) => {
    ReactDOM.render(<Dashboard />, dashboardMountNode);
  });
}

const wizardMountNode = document.getElementById('wizard');
if (wizardMountNode) {
  import("./client/Wizard").then(({ default: Wizard }) => {
    ReactDOM.render(<Wizard />, wizardMountNode);
  });
}

This works great, however if I load the development server from say another host running under a different URL such as say someurl.local in a script tag like:

<script src="http://localhost:3000/bundle.js"></script>

But then my chunks get loaded from the someurl.local host not the correct one to find them. I'm wondering if its possible to get around this or this just a crazy idea?

Thanks in advance!

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions