topic Code changes to the existing widget in ArcGIS Experience Builder Questions

Code changes to the existing widget

vijaybadugu — Tue, 17 Sep 2024 13:46:23 GMT

I created an app from developer version of ArcGIS EXB 1.15 , downloaded zip file to the local drive. I just wanted to modify the code of existing widgets, it is a compiled code. is there a way to modify the code to add customizations to the existing downloaded widgets?

Re: Code changes to the existing widget

Marshal — Tue, 17 Sep 2024 14:35:52 GMT

Adding custom widgets is done before exporting the app as a zip. Workflow would be something like below.

1) Copy the folder for the widget you want to modify from client\dist\widgets into your-extensions\widgets

2) Rename folder to your desired widget name

2) Update manifest.json to reflect the folder name in "name" and "label" attributes (I think only "name" is required, but I always change both)

3) Modify the files as needed in your new custom widget folder

3) Run npm start on the client folder to compile custom widget

4) Add and configure the customized widget in ExB. It will be at the bottom of the Insert Widgets list under Custom.

5) Export the application as zip and deploy

Re: Code changes to the existing widget

vijaybadugu — Tue, 17 Sep 2024 19:07:38 GMT

Thanks Marshal.

Re: Code changes to the existing widget

vijaybadugu — Wed, 18 Sep 2024 16:28:12 GMT

I copied the list widget to your-extensions, I am getting the below error

ERROR in ./your-extensions/widgets/list-custom/src/runtime/widget.tsx 19:0-64
Module not found: Error: Can't resolve 'jimu-ui/advanced/link-container'. do I need to install or change the path of it ?

Re: Code changes to the existing widget

Marshal — Wed, 18 Sep 2024 19:26:40 GMT

This is an issue when customizing the List widget specifically. See the comments in post below for resolution.

https://community.esri.com/t5/arcgis-experience-builder-questions/select-feature-on-map-click-instead-of-popup/m-p/1533566#M14652

Re: Code changes to the existing widget

vijaybadugu — Mon, 23 Sep 2024 18:56:39 GMT

I was able to resolve the issue. if some thing changes on the screen of list widget (adding buttons, text elements), how it would reflect same in VSCode ?

Re: Code changes to the existing widget

Marshal — Mon, 23 Sep 2024 19:39:41 GMT

Glad you got it working! I am not sure exactly what you mean, but it sounds like a more specific question about modifying the list widget.

In that case, I'd recommend accepting the solution on this question so that others can reference in the future. Then starting a new question with more appropriate title and specifics regarding what you are trying to accomplish with the list widget. You will likely get more support for your goal in that way (I am not an expert developer, so you'll get outside my skill level pretty fast!).