Как использовать объект Babel script внутри Javascript?

Question

Я разрабатываю приложение ReactJS с использованием синтаксиса Babel/JSX. Я хочу написать модуль, составленный из компонентов React. Но я не могу использовать объекты скрипта babel внутри Javascript так же, как я мог бы использовать объекты Javascript внутри другого Javascript.

HTML:

<script src="/js/react_babel_jsx.js" type="text/babel" ></script> 
<script src="/js/my_javascript.js"></script> 

/js/react_babel_jsx.js:

var Test = function(){ 

    this.hello = function() { 
     console.log('Hello!') 
    } 
} 

/js/my_javascript.js

new Test().hello() 

Консоль вывода в Chrome:

my_javascript.js:3 Uncaught ReferenceError: Test is not defined 

Как я могу использовать объекты сценария Babel внутри Javascript?

Answer 1

Переменные, определенные в сценарии Babel, завернуты в их собственное пространство для закрытия. Это так же, как это:

function BabelStuff() { 
    var Test = function() {} 
} 

function OtherStuff() { 
    var x = new Test() // Test not defined! 
} 

Если вы просто хотите, чтобы пройти эту проблему прямо сейчас вы можете добавить вещи в window имен.

window.Test = function(){ 
    this.hello = function() { 
     console.log('Hello!') 
    } 
} 

Но это должно быть только для тестирования, а не для производственных применений. Когда вы будете готовы двигаться дальше, вы захотите переписать свой код раньше времени. Вот общий шаблон, который поможет вам начать работу https://github.com/gaearon/react-hot-boilerplate