How do you make Webpack hot updates work when developing Custom Components?

App Building
1

I stumbled onto your github example that demonstrates how to use a webpack dev server to develop custom components.

I was able to make my component render by using the following script tag

<script type="text/javascript" src="http://localhost:8080/index.js" />

It works nicely, however, the hot update/reload feature doesn't work. I need to refresh the page to see my changes.

In the retool console, I can see the following...

index.js:573 [webpack-dev-server] App updated. Recompiling...
index.js:573 [webpack-dev-server] App hot update...

The repo suggests that it will show me

an example of hot reload within the Retool sandbox'd iframe

Any help would be appreciated!

2

Hey @Tim_Fairbrother!

Updating the custom component script unfortunately won't trigger a re-render in the custom component. You might try adding a button only visible in editor mode that you can use to reload the component without having to reload your whole app:

Does that help?

3

Thank you, that will speed things up.

I thought I was missing out on something. Running code in my dev environment is better than compiling, copying, and pasting.