Define Global Functions in a Visual Application

Global functions in a visual application work differently compared to extensions. Because a visual application can have multiple web apps, global functions can be defined only for a specific web app (under resources/functions), and imported by pages, flows, and so on, within the same web app.

When importing a global function in a page, the reference application:$functions must be used. The scope application refers to the current web application and is only supported in visual applications, not in extensions. For example, app1 is a web app with the utils.js file defined within it. Here's the structure it would take:

<visualAppRoot>/
  webApps/
    app1/
      resources/
        functions/
          utils.js
          functions.json
Importing this global function in some-page.json inside app1 would look like this in the page's JSON:
{
  "imports": {
    "modules": {
      "appUtils": {
        "path": "application:$functions/utils"
      }
    }
  }
}