How AMD Loader Configuration is Exported

Documentation Menu
Go Back

How AMD Loader Configuration is Exported

note

If you don’t understand how Liferay AMD Loader works under the hood, please read Liferay AMD Module Loader first.

With de-duplication in place, JavaScript modules are made available to Liferay AMD Loader through the configuration returned by the /o/js_loader_modules URL.

The OSGi bundle shown below is used for reference in this article:

  • my-bundle/
    • META-INF/
      • resources/
        • package.json
          • name: my-bundle-package
          • version: 1.0.0
          • main: lib/index
          • dependencies:
            • isarray: 2.0.0
            • isobject: 2.1.0
          • …
        • lib/
          • index.js
          • …
        • …
        • node_modules/

For example, for the above structure, as explained in OSGi Bundles and npm Package Structure, the configuration below is published for Liferay AMD loader to consume:

Liferay.PATHS = {
  ...
  '[email protected]/lib/index': '/o/js/resolved-module/[email protected]/lib/index',
  '[email protected]/index': '/o/js/resolved-module/[email protected]/index',
  '[email protected]/index': '/o/js/resolved-module/[email protected]/index',
  '[email protected]/index': '/o/js/resolved-module/[email protected]/index',
  ...
}
Liferay.MODULES = {
  ...
  "[email protected]/lib/index.es": {
    "dependencies": ["exports", "isarray", "isobject"],
    "map": {
      "isarray": "[email protected]",
      "isobject": "[email protected]"
    }
  },
  "[email protected]/index": {
    "dependencies": ["module", "require", "isarray"],
    "map": {
      "isarray": "[email protected]"
    }
  },
  "[email protected]/index": {
    "dependencies": ["module", "require"],
    "map": {}
  },
  "[email protected]/index": {
    "dependencies": ["module", "require"],
    "map": {}
  },
  ...
}
Liferay.MAPS = {
  ...
  '[email protected]': { value: '[email protected]/lib/index', exactMatch: true}
  '[email protected]': { value: '[email protected]/index', exactMatch: true},
  '[email protected]': { value: '[email protected]/index', exactMatch: true},
  '[email protected]': { value: '[email protected]/index', exactMatch: true},
  ...
}

Note:

  • The Liferay.PATHS property describes paths to the JavaScript module files.
  • The Liferay.MODULES property describes the dependency names and versions of each module.
  • The Liferay.MAPS property describes the aliases of the package’s main modules.

Not finding what you're looking for?

Pardon our dust as we revamp and transition our product documentation to this site. If something seems missing, please check Liferay Help Center documentation for Liferay DXP 7.2 and previous versions.

Try Liferay's Help Center