nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

refreshing custom widget under development

JohnCartwright3

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!

Find more posts tagged with

Accepted answers

JunshanLiu

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!

All comments

PhilLarkin1

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

JunshanLiu

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>

JohnCartwright3

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?

JohnCartwright3

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?

JunshanLiu

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.

BryanGrill1

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!

JunshanLiu

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!

DavidMartinez

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

Join the Conversation

Signed in members can post, follow updates, and more. New here? Register a free account.

Quick Links

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.