I am trying to integrate **Microsoft Entra ID authentication** in an SAP UI5 application using the `@azure/msal-browser` library.

### **Body**
I am trying to integrate **Microsoft Entra ID authentication** in an SAP UI5 application using the `@azure/msal-browser` library.  
However, I am facing an issue where the module cannot be resolved when running the app with `ui5 serve`.

---

#### **Error**

[FUTURE FATAL] Failed to load component for container container - ModuleError: Failed to resolve dependencies of 'com/acme/easydock/controller/App.controller.js' -> '@azure/msal-browser.js': failed to load '@azure/msal-browser.js' from resources/@azure/msal-browser.js: script load error ModuleError: Failed to resolve dependencies of 'com/acme/easydock/controller/App.controller.js' -> '@azure/msal-browser.js': failed to load '@azure/msal-browser.js' from resources/@azure/msal-browser.js: script load error

---

#### **Project Setup**
- **package.json**
```json
{
  "name": "easydock",
  "version": "0.0.1",
  "description": "An SAP Fiori application.",
  "main": "webapp/index.html",
  "devDependencies": {
    "@sap-ux/eslint-plugin-fiori-tools": "^0.4.0",
    "@sap/ux-ui5-tooling": "1",
    "@sapui5/types": "~1.142.0",
    "@typescript-eslint/eslint-plugin": "^7.1.1",
    "@typescript-eslint/parser": "^7.1.1",
    "@ui5/cli": "^4.0.16",
    "typescript": "^5.1.6",
    "ui5-tooling-modules": "^3.33.6",
    "ui5-tooling-transpile": "^3.9.2"
  },
  "scripts": {
    "start": "ui5 serve --config=ui5.yaml --port 8080 -o index.html"
  },
  "dependencies": {
    "@azure/msal-browser": "^4.26.1"
  }
}

• ui5.yaml

specVersion: "3.1"
metadata:
  name: com.acme.easydock
type: application
server:
  customMiddleware:
    - name: ui5-tooling-modules-middleware
      afterMiddleware: compression
    - name: ui5-tooling-transpile-middleware
      afterMiddleware: ui5-tooling-modules-middleware
      configuration:
        debug: true
        transformModulesToUI5:
          overridesToOverride: true
        excludePatterns:
          - /Component-preload.js
    - name: fiori-tools-proxy
      afterMiddleware: compression
      configuration:
        ui5:
          path:
            - /resources
            - /test-resources
          url: https://ui5.sap.com
    - name: fiori-tools-appreload
      afterMiddleware: compression
      configuration:
        port: 35729
        path: webapp
        delay: 300
    - name: fiori-tools-preview
      afterMiddleware: fiori-tools-appreload
builder:
  customTasks:
    - name: ui5-tooling-modules-task
      beforeTask: replaceVersion
      configuration:
        addToNamespace: true
    - name: ui5-tooling-transpile-task
      afterTask: ui5-tooling-modules-task
      configuration:
        addToNamespace: true

Controller Code

import Controller from "sap/ui/core/mvc/Controller";
import * as msal from "@azure/msal-browser";

export default class App extends Controller {
    public onInit(): void {
        const msalConfig = {
            auth: {
                clientId: 'YOUR_CLIENT_ID'
            }
        };
        console.log(msal);
    }
}

What I Tried

• Installed @azure/msal-browser via npm install.
• Added ui5-tooling-modules and ui5-tooling-transpile to handle ES modules.
• Verified that other npm packages work fine with this setup.

Question

How can I correctly load and use @azure/msal-browser in a UI5 application using ui5-tooling-modules?
Do I need additional configuration in ui5.yaml or a specific approach to handle libraries that use ES modules?