Error loading custom JS module in widget – "Unable to parse module"

[BigNavid]

Hello,

I cloned the release-4.0 branch of this repository and successfully built the JavaScript file. After uploading the generated .js file as a resource in ThingsBoard, I attempted to use it within a custom widget.

However, I encountered the following error when trying to load the widget:

Widget wasn't loaded due to the following errors:
Unable to parse module from URL: /api/resource/js_module/tenant/thingsboard-extension-widgets.js

I also tested this using the latest master branch, and the same error occurred.

I'm currently using ThingsBoard Community Edition, version 4.1.0.

I've attached the built JS file, renamed to .txt for GitHub compatibility.

👉 Please rename thingsboard-extension-widgets.txt back to .js before testing.

thingsboard-extension-widgets.txt

Any guidance or suggestions would be appreciated.
Thank you!

[vvlladd28]

Hi @BigNavid,

Thanks for reporting this issue. Could you please try updating to the latest version of the master branch and rebuilding the JS file? There might have been fixes or improvements since your last test that could resolve the "Unable to parse module" error when loading the custom widget.
If the problem persists after updating, please provide more details on your build process and any console logs from the browser.

Let me know how it goes!

[BigNavid]

Hi @vvlladd28,

Thanks for your response.

I pulled the latest version of the master branch and ran yarn install to ensure all dependencies were up to date. Then I used yarn start to serve the project locally and attempted to load the widget in ThingsBoard by referencing the resource URL:

http://localhost:5000/static/widgets/thingsboard-extension-widgets.js

However, I still received the following error in ThingsBoard when trying to use the widget:

Widget wasn't loaded due to the following errors:
Unable to parse module from url: http://localhost:5000/static/widgets/thingsboard-extension-widgets.js

There were no errors shown in the browser console.

To ensure the issue wasn’t due to serving from localhost, I also ran yarn build to generate the bundled JS file and uploaded it as a custom resource in ThingsBoard. But again, I encountered this error:

Widget wasn't loaded due to the following errors:
Unable to parse module from URL: /api/resource/js_module/tenant/thingsboard-extension-widgets.js

Any insights into what might be going wrong or additional steps I should try would be appreciated.

Thanks again!

[vvlladd28]

Hi @BigNavid,

We apologize for this situation — thank you for bringing it to our attention. We have checked this case in CE (Community Edition) and found that the example you referred to contained an error. This issue has already been fixed in the master branch.
In addition, we have added new examples showing how to use the unit converter in custom widgets, which should help you better understand and apply this functionality.
Please let us know if you need any clarifications or assistance with the examples — I’ll be happy to help!

[andrikop13]

It seems that the issue still persists. I have pulled the release-4.2 branch, which is aligned with the current master, and I am still encountering the following error when attempting to load the widget:

Widget wasn't loaded due to the following errors:
Unable to parse module from URL: /api/resource/js_module/tenant/thingsboard-extension-widgets.js

When I attempt to slightly modify the modules—similarly to what I had done in previous versions where everything worked as expected—I encounter a different runtime error:

Cannot read properties of null (reading 'bindingStartIndex')

Please address these problems — it has been affecting development for several months now and we cannot migrate to latest versions of Angular and use signals, new control flow etc!