refreshing custom widget under development

1495
8
Jump to solution
08-11-2019 03:07 PM
JohnCartwright3
New Contributor II

Experience Builder looks great so far!

I'm creating a custom widget under client/your-extensions/widgets/my-widget and have two node processes running:

1) cd server; node src/server

2) cd client; npm run start

When I edit the widget in client/your-extensions/widgets/my-widget I can see process #2 pick up the changes and deploy to dist/widgets/my-widget.  However the builder doesn't seem to recognize the update until I restart the server and re-add the widget. 

What is the recommended way to develop widget and be able to see your changes?

Thanks!

1 Solution

Accepted Solutions
JunshanLiu
Occasional Contributor III

Only reload is required when you change the widget's code. I have verified it works.

You don't need to restart server.

If you change the widget's manifest.json, you need to re-add the widget because the widget's manifest is saved in the app config for performance reason. In future release, we'll fix this issue.

Hope this helps!

View solution in original post

8 Replies
DavidMartinez
Esri Regular Contributor

Hi John,

When you run NPM start it launches webpack, which is watching for those updates in the your-extension directories. I just did some testing on my part and I had to refresh the page and add the widget again to the canvas for the changes to appear.  I am going to add my colleague Junshan Liu‌ to this discussion as he knows more about this hot reload works in Experience Builder. 

David 

0 Kudos
JunshanLiu
Occasional Contributor III

Only reload is required when you change the widget's code. I have verified it works.

You don't need to restart server.

If you change the widget's manifest.json, you need to re-add the widget because the widget's manifest is saved in the app config for performance reason. In future release, we'll fix this issue.

Hope this helps!

JohnCartwright3
New Contributor II

Thanks, that does help but it'd be really nice to have an automatic reload.  I tried a few permutations of browser-sync but couldn't get it working.  Any suggestions?

0 Kudos
JohnCartwright3
New Contributor II

I'm testing Beta2 and it seems like modifications to a custom widget's config.json (e.g. client/your-extensions/widgets/mywidget/config.json) also require the widget to re removed and re-added in order to take effect. Does that sound right?

0 Kudos
JunshanLiu
Occasional Contributor III

Yes, this is as designed. The config.json under widget folder is the default config, which means it’s used only when a new widget is added to the app.

发件人: John Cartwright <geonet@esri.com>

发送时间: 2020年2月5日 8:35

收件人: Junshan Liu <junshan_liu@esri.com>

主题: Re: - Re: refreshing custom widget under development

GeoNet, The Esri Community | GIS and Geospatial Professional Community <https://community.esri.com/?et=watches.email.thread>

Re: refreshing custom widget under development

reply from John Cartwright<https://community.esri.com/people/john.c.cartwright_noaa?et=watches.email.thread> in ArcGIS Experience Builder Beta - View the full discussion<https://community.esri.com/message/906701-re-refreshing-custom-widget-under-development?commentID=906701&et=watches.email.thread#comment-906701>

0 Kudos
PhilLarkin1
Regular Contributor

It would be extremely helpful if this was added to the documentation. It isn't obvious that an app needs to be removed for new content in config.json to be recognized. @Jianxia 

Maybe in the Props section? https://developers.arcgis.com/experience-builder/guide/extend-base-widget/#props

0 Kudos
BryanGrill1
New Contributor

Experience Builder is very cool. I was really happy/thankful to see ES6, React, TypeScript, etc.

Any thoughts on adding live reload like webpack dev server?

Thanks!

0 Kudos
JunshanLiu
Occasional Contributor III

Thanks!

I like the liveload feature but we have some issues when we try to use it at the beginning, so this feature is not included. But we are keeping eyes on it and try to use it.

0 Kudos