README

Allows ES-Module Plugins to be loaded in the Neos.Ui, by allowing <src type="module" />

for fully compatibility with ESM Neos Ui Plugin Builder with Esbuild

Issue in the Neos.Ui

neos/neos-ui#3097

Usage

Neos.Neos.Ui.resources.javascript and stylesheets can make use of the proposed attributes array.

Neos:
  Neos:
    Ui:
      resources:
        javascript:
          'My.Cool:Plugin':
            resource: 'resource://My.Cool/Public/NeosUserInterface/Plugin.js'
            # legacy first level attribute 'defer'
            # defer: true

            # NEW Attributes!
            attributes:
              type: "module"
              defer: true
              any: "thing"

        stylesheets:
          'My.Cool:Plugin':
            # NEW Attributes!
            attributes:
              any: "thing"

Install

composer require mhsdesign/proposal-neos-ui-esm-plugin-loader

Implementation

The Neos.Ui uses a StyleAndJavascriptInclusionService, which reads the Neos.Neos.Ui.resources.javascript and builds html <src> tags from it.

This Service is now replaced in Objects.yaml with a version, which allows additional attributes.

(Line 100)

- $defer = key_exists('defer', $element) && $element['defer'] ? 'defer ' : '';
- $result .= $builderForLine($finalUri, $defer);
+ $additionalAttributes = array_merge(
+     // legacy first level 'defer' attribute
+     isset($element['defer']) ? ['defer' => $element['defer']] : [],
+     $element['attributes'] ?? []
+ );
+ $result .= $builderForLine($finalUri, $this->htmlAttributesArrayToString($additionalAttributes));