Experience Builder Dev Config Caching Issue

[JasonCityOfTacoma]

EXB DEV Version: 1.14

Windows 10

I'm working on a custom widget that requires constant changes to the config.json during development. Saved changes to any of the .ts files show up in the application upon save, but changes to the config do not. 

I end up having to restart the server and add the widget to a new application to get the changes to the config to show up. 

Is there any way to force EXB to read changes to the config? Or is there a less annoying solution than restarting the server and adding the widget to a new experience? 

[Allen_Zhang]

I think you don't need to restart the server. You can try Ctrl+Shift+R to clear the cache, or disable the cache in DevTools Network(remember to uncheck it when you're not developing).

Re-adding a new widget is inevitable because the default settings defined in config.json are applied when adding a widget.

Another solution is to define the default settings in the widget.tsx instead of the config.json. Such as below code from the measurement widget:

[JasonCityOfTacoma]

Thank you for your response! 

My understanding is that EXB treats the config.json a certain way, it has to be named exactly that, and it gets cached automatically when the widget is added. 

In my config I'm maybe doing too much? I'm defining rest endpoints for the widget to query and defining fields and hyperlinks. Basically, a user clicks on the map, and the widget gathers data from ArcGIS REST endpoints that are not in the map and displays it in a custom widget. So I'm constantly changing the config during development. 

I'd like to keep that configuration separate from the business logic in the widget. Can you recommend a method that would allow me to see immediate changes during development, without adding more to my widget file? 

[Allen_Zhang]

If you don't want to re-adding a new widget, defining the default settings in the config.json won't do it.

To keep the business logic clean, you can store the default settings in another file such as config.ts, and merge them in widget.tsx.

//config.ts
export const defaultConfig = {
  a: 'foo',
  b: false
}
//
import defaultConfig from '../config.ts'

function Widget (props: AllWidgetProps<IMConfig>): React.ReactElement {
  const { id, config } = props
  // If the config has deep structure, use lodash.merge(config, defaultConfig)
  const fullConfig = Object.assign(config, defaultConfig)
  const {
    a,
    b
  } = fullConfig
  ...

[WesleyO]

Hi @JasonCityOfTacoma ,

This is the recommended approach: https://developers.arcgis.com/experience-builder/guide/deployment-topics/#service-worker-cache

Let me know if there are any questions.

[JasonCityOfTacoma]

That works for deployment, but what about during development? I'm trying to avoid having to restart/rename things because I made a change to a configuration file. Should I be importing a separate config file for things like REST endpoints and URL template, that is not in the main config.json that EXB is looking for?