Automatic reload - Custom Widget Development

2
Hi, I used the Mendix Widget Generator to create a custom widget in typescript and added it to my Mendix App.  Now everytime I did some changes in my custom app, I need to sync the directory and rebuild the app to see the changes in the browser.  Is there any way how to prevent this so that the browser automatically reloads as soon as I save any changes in my custom widget, or can I see the changes of my react app in the browser outside of the mendix app?  
asked
3 answers
2

I solved this issue by disabling the browser cache

answered
1

Hi Anna,

while you are working on a custom React widget with TypeScript or JavaScript ( using @mendix/widget ) to generate the widget folders/structure. open package.json to view your scripts, one of the scripts is npm run start, this script will run the widget and run live reload too, with every save action on your IDE ( VSCode for an example ) it will re-run the tests of the widget.

next step is to go to your project in Studio Pro - Project tab – Synchronize Project Directory ( this will refresh your widget with the latest update you made on your files( React classes ). following it with run locally to make sure you will view the latest edits you did. That’s what I came up with as a solution but couldn’t find any faster way.

However, Kindly note that if you are editing your XML file, on save the live reload wont be triggered unless you abort/cancel the running script (npm run start) and run it again to be able to build the xml file again. this process is actually long but that’s what I have for now.  

answered
1

Hi Anna, 

You can use the pluggable-widget-tools to achieve this.

When creating widgets for web you can use the task 

  • start:web Build and watch the changes of your Web widget. Your web app will reload automatically to reflect changes. You need to run the command on the same machine as Studio Pro

For Native widgets you can use the task 

  • start:native Build and watch the changes of your Native widget. Your native app will reload automatically to reflect changes.
answered