Community

Wrapping custom js api widget as ExB widget fails on dojo/i18n

1446
11
05-20-2020 06:31 AM
MatejVrtich
by Esri Contributor
Esri Contributor
‎05-20-2020 06:31 AM

Hi,

I have a custom widget written in JS API 4.x and I followed the https://github.com/Esri/arcgis-experience-builder-sdk-resources/tree/master/samples/js-api-widget to wrap the widget inside an ExB widget.

Let's assume the custom JS API widget is called Template and the build/transpiled files structure is:

- \Template.js

- \Template\TemplateViewModel.js

- \Template\nls\Template.js

- \Template\css\Template.css

Then I followed these steps to add the widget into the ExB: 

- added the custom widget's transpiled files into the ExB widget's lib folder (your-extensions\widgets\my-custom-widget\src\runtime\lib)

- imported the custom widget inside the ExB widget class (import Template from "./lib/Template")

- create the widget instance as showcased in the sample mentioned above

Then, in runtime of the ExB application, loading the widget fails on systemjs.js fetching nls/localization files of the custom JS API widget.

As my custom JS API 4.x widget imports its localization files using dojo/i18n!./Template/nls/Template, this does not work while wrapping the widget inside an ExB widget.

What is the best practice to wrap custom JS API widgets inside an ExB widgets?

Thanks,

Matej

0 Kudos
11 Replies
MatejVrtich
by Esri Contributor
Esri Contributor
‎06-18-2020 12:47 AM

David Martinez‌ and Gavin Rehkemper‌, thank you for your help in this.

The main issue in my case was missing the arcgis dependency in the ExB widget's manifest file.

"dependency": ["jimu-arcgis"]

After adding this dependency, I can use my custom js api widget in the ExB widget.

However, if I my custom js api widget uses the dojo/i18n module for localization, the ExB cannot load the localization files of the custom js api widget. The "Template" widget from the sample project attached at the beginning of this thread is an example of custom js api widget with localization files.

Anyway, I already rewritten my js api widget as ExB widget and have to say, it was the best learning experience.

I'm just curious, if there is some way to solve this without the rewrite.

Thanks,

Matej

0 Kudos