Wykonywanie transformacji jsx na kliencie

Question

Buduję aplikację, która umożliwia użytkownikom tworzenie i stosowanie własnych komponentów i szablonów. Chcę zezwolić użytkownikom na edycję ciągów danych jsx, a następnie wykonać przekształcenie po stronie klienta dla renderowania.

Podczas gdy w in browser transform wykonuje transformacje jsx na skryptach osadzonych, a na serwerze jest dostępny react-tools, nie mogę określić, jak udostępnić funkcję transformacji klientowi.

Transformacja przeglądarki nie wydaje się zapewniać żadnych metod dostępu, a Atomify/Browserify ulega awarii, gdy próbuję użyć transformacji narzędzia reagowania na kliencie.

Answer 1

eksportu modułu JSXTransformer dwie funkcje:

• transform wykonuje kod źródłowy JSX jako ciąg i zwraca obiekt z kluczem o nazwie code którego wartość jest ciągiem JavaScript, które mogą być następnie eval'd.

• exec działa jak transform, a wynik jest następnie przekazywany do eval.

toll:

JSXTransformer.transform("React.createClass({render: function() { return <div></div>; } });").code 

... produkuje tę równinę JavaScript wyjściowa:

"React.createClass({render: function() { return React.createElement("div", null); } });" 

Answer 2

JSXTransformer był deprecated in mid-2015 na rzecz rozwiązania Babla w przeglądarce, babel-standalone: https://babeljs.io/docs/setup/#installation

Dyskusja tutaj: https://github.com/facebook/react/issues/5497