2015-09-18 23 views
5

Próbuję wywołać transformacje JSX w przeglądarce przy użyciu Babel.RequireJS + Babel + JSX

Ja ładuje moduł AMD JS w przeglądarce przy użyciu następujących:

require(["nbextensions/ht"] function(ext){}); 

który ostatecznie importuje ten moduł „ui”, który wywołuje funkcję do renderowania JSX. Jednak to nie wydaje się być wyzwalaniem transformatora JSX w przeglądarce Babel. Czy można nawet wywołać Babel's JSX Transformer z kontekstu RequireJS?

var BOWER = '/nbextensions/ht/bower_components' 
var COMPONENTS = '/nbextensions/ht/components' 
var NODE_MODULES = '/nbextensions/ht/node_modules' 

requirejs.config({ 
    paths: { 
    es6: NODE_MODULES + "/requirejs-babel/es6", 
    babel: NODE_MODULES + "/requirejs-babel/babel-5.8.22.min" 
    } 
}) 

define([ 
    BOWER + '/react/react.min.js', 
    "es6!" + COMPONENTS + "/App.jsx" 
],function(React, App){ 
    console.log("Loaded React v" + React.version) 

    var ui = {} 
    ui.render = function() { 
    React.render(<App/>, document.getElementById("ht_main")) 
    } 

    return ui 
}) 

Odpowiedz

1

Ah, wymyśliłem to. Metoda używana tutaj działa, ale transformacja JSX RequireJS działa tylko na zaimportowanym module (main.js nie może mieszać JSX).

Dlatego moduł Component powinien po prostu być zawinięty w prototyp funkcji, który udostępnia metodę render() do React.render.

Patrz przykład na stronie github.

+0

To nie jest już ważne. JSXTransformer jest przestarzały od czasu Reakcji 0.14 –

Powiązane problemy