Uploaded image for project: 'PUBLIC - Liferay Portal Community Edition'
  1. PUBLIC - Liferay Portal Community Edition
  2. LPS-133942

Allow loading shared dependencies in fragments

    Details

      Description

      Currently there is no official way to load dependencies in fragments. Although there are some unofficial and not supported ways to do this, we should provide a more standard way to reuse code between fragments. The most common use case is to load some dependency.js from many different fragments (or many instances of the same fragment) without duplicating any code.

      As an initial approach, we should provide a minimal but functional API that allows loading some already declared dependency: "require('dependency')" will return a promise that resolves into the loaded module (similar to standard import() implementation) and rejects with a developer-friendly error. This way fragment developers will be able to write:

      require('logger').then(loggerModule => { loggerModule.default('hello'); });

      However, we still need a way to declare these dependencies before loading them inside fragments. Our first approach will be using already existing "Shared Bundles" (check JS Toolkit showcase of how to create a dependency provider). For example, if we export "logger 7.4.1" from our shared bundle named "custom-deps", we will be allowed to import:

      require({ provider: 'custom-deps',   package: 'logger',   version: '7.4.1' }).then(loggerModule => { loggerModule.default('hello'); });
       

      Further development

      Although this will not be part of the feature request, there are some improvements that we could consider in the future:

      1. Declaring shared bundles namespaces in fragment.json (or collection.json) files, so we do not need to write the full path to the namespace or the dependency version in every fragment (ex. "require('react')" with a default provider and version).
      2. Allow importing these dependencies not only with require(), but also as a regular import declaration (only with for React/compiled fragments).
      3. Allow including shared bundles in design packs.

       

      Related slack thread: https://liferay.slack.com/archives/CL9RTSZ52/p1620810714452000

      /cc Ivan Zaera

        Attachments

          Activity

            People

            Assignee:
            support-lep@liferay.com SE Support
            Reporter:
            pablo.molina Pablo Molina
            Votes:
            1 Vote for this issue
            Watchers:
            1 Start watching this issue

              Dates

              Created:
              Updated:

                Packages

                Version Package