Sono nuovo di Magento2 e la nostra organizzazione ha appena ottenuto la licenza EE. L'ho installato sul mio computer locale e il modello predefinito sputa il seguente mixato con HMTL:

<script type="text/x-magento-init">
{
    "*": {
        "Magento_Ui/js/core/app": {
            "components": {
                "customer": {
                    "component": "Magento_Customer/js/view/customer"
                }
            }
        }
    }
}
</script>

E chiama come

<script type="text/x-magento-init">
{
"*": {
    "Magento_Ui/js/core/app": {
        "components": {
                "messages": {
                    "component": "Magento_Theme/js/view/messages"
                }
            }
        }
    }
}
</script>

Ha a che fare con KnockoutJSo RequireJS? Quali sono queste chiamate e qual è questo nuovo tag di script<script type="text/x-magento-init">

Uso generale del "tipo di script"

Quando si utilizza <script type="....">il browser interpreta solo ciò che conosce (come text/javascriptad esempio).
Qualsiasi altra cosa viene ignorata.
Fondamentalmente utilizzando un tipo personalizzato si stanno aggiungendo informazioni alla pagina senza visualizzarle e senza che il browser le interpreti e in seguito è possibile utilizzare tali informazioni come desiderato.

Come Magento lo usa

Magento utilizza queste sezioni dopo il caricamento della pagina.
Il codice che li utilizza si trova in lib/web/mage/apply/scripts.js.
Non capisco completamente cosa fa il file sopra menzionato, ma c'è un commento all'interno del file che afferma questo:

/**
 * Parses 'script' tags with a custom type attribute and moves it's data
 * to a 'data-mage-init' attribute of an element found by provided selector.
 * Note: All found script nodes will be removed from DOM.
 *
 * @returns {Array} An array of components not assigned to the specific element.
 *
 * @example Sample declaration.
 *      <script type="text/x-magento-init">
 *          {
 *              "body": {
 *                  "path/to/component": {"foo": "bar"}
 *              }
 *          }
 *      </script>
 *
 * @example Providing data without selector.
 *      {
 *          "*": {
 *              "path/to/component": {"bar": "baz"}
 *          }
 *      }
 */

Conclusione / Speculazione

Immagino che questo sia un modo per impostare comportamenti js diversi su elementi diversi nella pagina senza la necessità di riscrivere il modello che contiene gli elementi.
Devi solo aggiungere a <script type="text/x-magento-init">in uno dei tuoi modelli, includere il tuo modello nella pagina e magento "auto-magicamente" sposta il comportamento sull'elemento giusto.

Inoltre,

vendor \ Magento \ magento2-base \ lib \ web \ mago \ applicare \ scripts.js

var scriptSelector = 'script[type="text/x-magento-init"]',
        dataAttr = 'data-mage-init',
        virtuals = [];

Utilizzando le guide seguenti

http://devdocs.magento.com/guides/v2.1/javascript-dev-guide/javascript/js_init.html

La sintassi standard è

<script type="text/x-magento-init">
{
    // components initialized on the element defined by selector
    "<element_selector>": {
        "<js_component1>": ...,
        "<js_component2>": ...
    },
    // components initialized without binding to an element
    "*": {
        "<js_component3>": ...
    }
}
</script>

Riferendosi

http://alanstorm.com/magento_2_javascript_init_scripts

http://alanstorm.com/magento_2_introducing_ui_components

Magento stesso usa spesso il x-magento-initmetodo per invocare un modulo RequireJS come programma. Tuttavia, il vero potere di x-magento-initè la possibilità di creare un componente Javascript Magento.

I componenti Javascript Magento sono moduli RequireJS che restituiscono una funzione.

Magento incontra un text/x-magento-inittag di script con un attributo *, lo farà

1] Inizializza il modulo RequireJS specificato (Magento_Ui / js / core / app)

2] Chiama la funzione restituita da quel modulo, passando l'oggetto dati

Spero che sia d'aiuto