Код не выполняется внутри динамически созданного <script> элемент с типом «text/jsx»

Question

Я работаю над приложением, где мне нужно динамически загружать сценарии. Я попытался загрузить скрипты с помощью метода createElement. Поскольку это приложение React, мне нужно установить атрибут типа тега script как «text/jsx». Я сделал что-то вроде этого:

var headTag = document.getElementsByTagName("head")[0]; 
    var scriptEle = document.createElement("script"); 
    scriptEle.src = "app.js"; 
    scriptEle.setAttribute("type","text/jsx"); 
    headTag.appendChild(scriptEle); 
    scriptEle.onload = function() { 
    //success 
    } 
    scriptEle.onerror = function(error) { 
    //error 
    } 

Если установить тип атрибута «текст/JSX», код внутри файла app.js не выполняется. Также onload и onerror не выполняются.

Есть ли способ выполнить код app.js, сохраняя тип «text/jsx»?

Спасибо.

Answer 1

Браузер не может понять/скомпилировать jsx, поэтому у нас есть транслятор; который скомпилирует ваш код в собственный javascript, а затем вы можете включить его здесь.

Chcek babel здесь