[ui5-tooling-modules] Certain Shims not working since ui5-tooling-modules version 0.7.12

[Talwynox]

Expected Behavior

The build should complete successfully with version 0.7.12, with no errors related to the handling of shim projects.

Current Behavior

When upgrading from version 0.7.10 to version 0.7.12, the build process fails due to the incorrect handling of some shim projects. This issue seems to have been caused by a change in the Rollup version from 3.17.2 to 3.20.0.

Steps to Reproduce the Issue

1. Create UI5 App with ui5-tooling-modules: ^0.7.12
2. Add @stomp/stompjs (might also happen with other packages) as shim
3. Add a component which imports stompjs
4. run ui5 build

Context

• UI5 Module Version (output of ui5 --version when using the CLI): 3.0.3
• Node.js Version: v18.12.1
• npm Version: 9.6.1
• OS/Platform: win10
• Browser (if relevant): unknown
• Other information regarding your environment (optional): nothing

Log Output / Stack Trace

error lbt:bundle:Resolver **** error: missing module @stomp/stompjs.js, required by .../messageQueue/ConnectionStomp.js

[petermuessig]

Hmm, this rollup drives me crazy... 😅 I'll take a look...

[petermuessig]

Can you test with: "ui5-tooling-modules": "^0.9.3"

With this version it works for me!

Unfortunately, the minor updates in the 0 major version are considered as major version upgrades.

[Talwynox]

Version 0.9.3 does not work at at It always fails with Cannot find module 'ignore-walk' Version 0.9.4 fails with the same error as 0.7.13

[petermuessig]

Hi @Talwynox,

the issue with ignore-walk has been reported yesterday after your issue and was fixed immediately with #725 . I then released the version 0.9.4 to fix this.

Back to your issue: I need more details - I did the following and it works:

1. Create an UI5 app using easy-ui5: https://blogs.sap.com/2022/03/10/easy-ui5-getting-started-even-easier/ (choose the app)
2. Installing ui5-tooling-modules as dev dependency and adding it to the ui5 > dependencies in the package.json (since the generator still generates V2, will be updated this month!)
3. Update the ui5.yaml and add the task and middleware configuration

builder:
  customTasks:
    - name: ui5-tooling-modules-task
      afterTask: replaceVersion
server:
  customMiddleware:
    - name: ui5-tooling-modules-middleware
      afterMiddleware: compression

4. Adding the @stomp/stompjs package as dependency
5. In the Main.controller.js add the dependency to @stomp/stompjs like that:

sap.ui.define([
  "./BaseController",
  "sap/m/MessageBox",
  "@stomp/stompjs"
], function (BaseController, MessageBox, stompjs) {
  "use strict";

  console.log(stompjs);

6. Build the project npm run build

In the build output I can now find the stompjs.js file in the folder dist/resources/@stomp/. The build runs without issues for me. Also, when running the project I can see the stompjs object in the console:

Do I miss anything here? Maybe you can share your package.json and ui5.yaml with me or the project if it is a public project? Sometimes there are also side effects from other dependencies in the bundling process. This needs a bit more in depth analysis.

Best regards, Peter

[petermuessig]

I updated the project above to use the UI5 Tooling V3 and it still works for me. I attached my project here: com.myorg.myapp.zip

[Talwynox]

It seems like the problem only occurs when libaries are involved. We setup this simple but kind of hacky project which reproduces the error: https://github.com/dstigl/UI5-Test-Projects.

Steps to run

1. npm i
2. npm run install:lib1
3. npm run watch:lib1
4. npm build:opt

If we change the version of ui-tooling-modules back to 0.7.10 it works fine.

[petermuessig]

Thx @Talwynox for the sample project - I missed to look at a small detail:

The build result using 0.7.10:

info my.projects.test › Running task minify...
info my.projects.test › Running task generateFlexChangesBundle...
info my.projects.test › Running task generateStandaloneAppBundle...
error lbt:bundle:Resolver **** error: missing module sap/ui/support/Bootstrap.js, required by sap/ui/core/Core.js
error lbt:bundle:Resolver **** error: missing module sap/ui/testrecorder/Bootstrap.js, required by sap/ui/core/Core.js
error lbt:analyzer:JSModuleAnalyzer Unhandled AST node type MetaProperty Node {
  type: 'MetaProperty',
  start: 51842,
  end: 51852,
  meta: Node { type: 'Identifier', start: 51842, end: 51845, name: 'new' },
  property: Node { type: 'Identifier', start: 51846, end: 51852, name: 'target' }
}
error lbt:resources:ResourcePool Failed to analyze chart.js/auto.js: Unhandled AST node type MetaProperty
info my.projects.test › Running task transformBootstrapHtml...
info ProjectBuilder Build succeeded in 31 s
info ProjectBuilder Executing cleanup tasks...

The build result using 0.9.4:

info my.projects.test › Running task generateStandaloneAppBundle...
error lbt:bundle:Resolver **** error: missing module sap/ui/support/Bootstrap.js, required by sap/ui/core/Core.js
error lbt:bundle:Resolver **** error: missing module sap/ui/testrecorder/Bootstrap.js, required by sap/ui/core/Core.js
error lbt:analyzer:JSModuleAnalyzer Unhandled AST node type MetaProperty Node {
  type: 'MetaProperty',
  start: 51842,
  end: 51852,
  meta: Node { type: 'Identifier', start: 51842, end: 51845, name: 'new' },
  property: Node { type: 'Identifier', start: 51846, end: 51852, name: 'target' }
}
error lbt:resources:ResourcePool Failed to analyze chart.js/auto.js: Unhandled AST node type MetaProperty
error lbt:bundle:Resolver **** error: missing module @stomp/stompjs.js, required by my/libraries/lib1/Lib1Stomp.js
info my.projects.test › Running task transformBootstrapHtml...

This happens during the generateStandaloneAppBundle build step - but I need to investigate this further what the difference between those versions is. The difference is your mentioned line:

error lbt:bundle:Resolver **** error: missing module @stomp/stompjs.js, required by my/libraries/lib1/Lib1Stomp.js

BTW: you do not need to mix Babel anymore with the tooling - you can easily combine them using the ui5-tooling-transpile tooling extension - maybe I can create a PR the next days for you which simplifies your project setup...

[petermuessig]

The issue appears with the upgrade from 0.7.10 to 0.7.11: https://github.com/ui5-community/ui5-ecosystem-showcase/blob/main/packages/ui5-tooling-modules/CHANGELOG.md => #696

In previous versions the plugin also examined the dependencies to find the entry points for the 3rd party libraries: https://github.com/ui5-community/ui5-ecosystem-showcase/blob/d27b55e5bd2ad95336bdad8f4f07cd0e10ac2ca2/packages/ui5-tooling-modules/lib/task.js#L293

This was wrong and lead to duplicates during the build. After talking to the UI5 tooling team, they pointed me to use the includeDependency setting. When using includeDependency configuration as shown in the ecosystem, the dependency is build separately and also the proper plugins will be executed. Also the library needs to define the ui5-tooling-modules and it needs to run in the libraries build. This is necessary because if you ship the library, the consume must not know about the the 3rd pary usage und just consume it as dependency.

Should I create a PR on your repo to show how it is expected to be configured?

[Talwynox]

Thanks for the infos. Yes would appreciate a PR.

[petermuessig]

PR has been created in your repository - see link above - once merged this will close this issue! 😄

[Talwynox]

Thank you, we'll review it when we have the chance.