저는 Magento2를 처음 접했고 우리 조직은 EE 라이센스를 얻었습니다. 로컬 컴퓨터에 설치했으며 기본 템플릿은 HMTL과 함께 다음을 혼합합니다.

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

그리고 같은 호출

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

함께 할 수있는이인가 KnockoutJS또는 RequireJS? 이러한 호출은 무엇이며이 새로운 스크립트 태그는 무엇입니까<script type="text/x-magento-init">

"스크립트 유형"의 일반적인 사용법

<script type="....">브라우저를 사용 하면 알고있는 것만 해석합니다 (예 text/javascript를 들어).
다른 것은 무시됩니다.
기본적으로 사용자 정의 유형을 사용하면 정보를 표시하지 않고 브라우저가 해석하지 않고 페이지에 정보를 추가하므로 나중에 원하는대로 해당 정보를 사용할 수 있습니다.

마 젠토가 이것을 사용하는 방법

Magento는 페이지가로드 된 후이 섹션을 사용합니다.
이를 사용하는 코드는에 있습니다 lib/web/mage/apply/scripts.js.
위에서 언급 한 파일의 기능을 완전히 이해하지 못하지만 파일 내에 다음과 같은 주석이 있습니다.

/**
 * 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"}
 *          }
 *      }
 */

결론 / 추측

나는 이것이 요소를 포함하는 템플릿을 다시 작성할 필요없이 페이지의 다른 요소에 다른 js 동작을 설정하는 방법이라고 추측합니다. 템플릿 중 하나만
추가 <script type="text/x-magento-init">하고 페이지에 템플릿을 포함하면 magento가 "자동으로"동작을 올바른 요소로 이동합니다.

게다가,

vendor \ magento \ magento2-base \ lib \ web \ mage \ apply \ scripts.js

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

아래 가이드를 사용하여

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

표준 구문

<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>

참조하여

http://alanstorm.com/magento_2_javascript_init_scripts

http://alanstorm.com/magento_2_introducing_ui_components

Magento 자체는 종종이 x-magento-init메소드를 사용하여 RequireJS 모듈을 프로그램으로 호출합니다. 그러나 실제 x-magento-init장점은 Magento Javascript 구성 요소를 만드는 기능입니다.

Magento Javascript 구성 요소는 함수를 반환하는 RequireJS 모듈입니다.

마 젠토 text/x-magento-init는 * 속성을 가진 스크립트 태그를 만나게 됩니다.

1] 지정된 RequireJS 모듈을 초기화합니다 (Magento_Ui / js / core / app)

2] 해당 모듈에서 반환 한 함수를 호출하여 데이터 객체를 전달합니다.

그것이 도움이되기를 바랍니다.