browserifyの設定方法は？

Question

モジュールをインストール（browserify、react、reactify）し、browserifyを使用してjsxファイルを処理しようとしました。

var React = require("react"); 
 
var App = React.createClass({ 
 
    render: function() { 
 
     return <h1>111</h1> 
 
    } 
 
}); 
 
React.render(
 
    <App/>, 
 
    document.body 
 
)

C:\dev\React.js>browserify app.js -o buld.js Error: Parsing file C:\dev\React.js\app.js: Unexpected token (4:15) at Deps.parseDeps (C:\Users\admin\AppData\Roaming\npm\node_modules\browserify\node_modules\module-deps\index.js:481:28) at getDeps (C:\Users\admin\AppData\Roaming\npm\node_modules\browserify\node_modules\module-deps\index.js:414:40) at C:\Users\admin\AppData\Roaming\npm\node_modules\browserify\node_modules\module-deps\index.js:398:32 at ConcatStream. (C:\Users\admin\AppData\Roaming\npm\node_modules\browserify\node_modules\concat-stream\index.js:36:43) at emitNone (events.js:91:20) at ConcatStream.emit (events.js:185:7) at finishMaybe (C:\Users\admin\AppData\Roaming\npm\node_modules\browserify\node_modules\concat-stream\node_modules\readable-stream\lib_stream_writable.js:475:14 ) at endWritable (C:\Users\admin\AppData\Roaming\npm\node_modules\browserify\node_modules\concat-stream\node_modules\readable-stream\lib_stream_writable.js:485:3) at ConcatStream.Writable.end (C:\Users\admin\AppData\Roaming\npm\node_modules\browserify\node_modules\concat-stream\node_modules\readable-stream\lib_stream_writ able.js:455:41) at DuplexWrapper.onend (C:\Users\admin\AppData\Roaming\npm\node_modules\browserify\node_modules\readable-stream\lib_stream_readable.js:570:10)

どこ間違いでしょうか？

Answer 1

エラーはJSXをbrowserfyコンパイラにロードしようとした結果です。あなたの解像度チェーンにreactify含める必要が

return <h1>111</h1> 

と

<App/>, 

：

具体的https://www.npmjs.com/package/reactify 、あなたのCLIコマンドは少しのようになります。 browserify -t reactify app.js -o build.js

をあなたはReactをたくさんやる人として、BabelとWebpackの使用を検討すべきです。彼らは多くの偉大な追加の開発ツールを提供しています。私は拡張するのが簡単だと思いますが、それはただの意見です。