ui5-community / ui5-ecosystem-showcase

A repository showcasing the UI5 tooling extensibility to combine OSS tools for UI5 application development.
https://ui5-community.github.io/ui5-ecosystem-showcase/
Other
194 stars 93 forks source link

[ui5-tooling-modules] How to bundle third party npm modules in a library? #990

Closed swayongshen closed 6 months ago

swayongshen commented 6 months ago

Problem: I have a UI5 Typescript library with some custom controls that depend on fabricjs. I have added ui5-tooling-modules-task as a customTask and fabricjs is indeed bundled as dist/resources/fabric.js when the library is built.

However, in the application that consumes this library, when my control is loaded, this error is shown which suggests that the application is trying to load its own version of fabric.js instead of using the one from my library.

image
petermuessig commented 6 months ago

Make sure that you use the addToNamespace option in the ui5.yaml for the ui5-tooling-modules:

ui5.yaml

[...]
builder:
  customTasks:
    - name: ui5-tooling-modules-task
      afterTask: replaceVersion
      configuration:
        addToNamespace: true

It ensures to include the fabric.js in the namespace of your application.

You can find more about this option here: https://www.npmjs.com/package/ui5-tooling-modules