javascript - Browserify Error: Parsing file, Unexpected token -

i trying use npm module browserify.

when run $ browserify build/widget.js -o bundle.js, recieve following error:

error: parsing file /users/nir/browsewidget/node_modules/react-spin/src/main.js: unexpected token (29:6)     @ deps.parsedeps (/usr/local/lib/node_modules/browserify/node_modules/module-deps/index.js:436:28)     @ fromsource (/usr/local/lib/node_modules/browserify/node_modules/module-deps/index.js:375:44)     @ /usr/local/lib/node_modules/browserify/node_modules/module-deps/index.js:369:17     @ concatstream.<anonymous> (/usr/local/lib/node_modules/browserify/node_modules/concat-stream/index.js:36:43)     @ concatstream.emit (events.js:129:20)     @ finishmaybe (/usr/local/lib/node_modules/browserify/node_modules/readable-stream/lib/_stream_writable.js:460:14)     @ endwritable (/usr/local/lib/node_modules/browserify/node_modules/readable-stream/lib/_stream_writable.js:469:3)     @ concatstream.writable.end (/usr/local/lib/node_modules/browserify/node_modules/readable-stream/lib/_stream_writable.js:436:5)     @ duplexwrapper.onend (/usr/local/lib/node_modules/browserify/node_modules/readable-stream/lib/_stream_readable.js:537:10)     @ duplexwrapper.g (events.js:199:16) 

note: file build/widget.js not jsx, has been built using jsx compiler.

why receiving unexpected token?

edit based on snozza's answer:

i have installed npm install reactify --save.

then ran % browserify -t reactify build/widget.js gave -bash: fg: %: no such job

then tried browserify -t reactify build/widget.js , gave:

error: parsing file /users/nir/browsewidget/node_modules/react-spin/src/main.js: unexpected token (29:6)     @ deps.parsedeps (/usr/local/lib/node_modules/browserify/node_modules/module-deps/index.js:436:28)     @ fromsource (/usr/local/lib/node_modules/browserify/node_modules/module-deps/index.js:375:44)     @ /usr/local/lib/node_modules/browserify/node_modules/module-deps/index.js:369:17     @ concatstream.<anonymous> (/usr/local/lib/node_modules/browserify/node_modules/concat-stream/index.js:36:43)     @ concatstream.emit (events.js:129:20)     @ finishmaybe (/usr/local/lib/node_modules/browserify/node_modules/readable-stream/lib/_stream_writable.js:460:14)     @ endwritable (/usr/local/lib/node_modules/browserify/node_modules/readable-stream/lib/_stream_writable.js:469:3)     @ concatstream.writable.end (/usr/local/lib/node_modules/browserify/node_modules/readable-stream/lib/_stream_writable.js:436:5)     @ duplexwrapper.onend (/usr/local/lib/node_modules/browserify/node_modules/readable-stream/lib/_stream_readable.js:537:10)     @ duplexwrapper.g (events.js:199:16) 

here snippet of build/widget.js requested:

    var react =require('react');     var spinner = require('react-spin')      var loading = react.createclass({displayname: "loading",         render: function() {             var spincfg ={               lines: 5 // number of lines draw               , length: 5 // length of each line               , width: 42 // line thickness               , radius: 21 // radius of inner circle               , scale: 1 // scales overall size of spinner               , corners: 1 // corner roundness (0..1)               , color: '#000' // #rgb or #rrggbb or array of colors               , opacity: 0.25 // opacity of lines               , rotate: 0 // rotation offset               , direction: 1 // 1: clockwise, -1: counterclockwise               , speed: 1 // rounds per second               , trail: 60 // afterglow percentage               , fps: 20 // frames per second when using settimeout() fallback css               , zindex: 2e9 // z-index (defaults 2000000000)               , classname: 'spinner' // css class assign spinner               , top: '50%' // top position relative parent               , left: '50%' // left position relative parent               , shadow: false // whether render shadow               , hwaccel: false // whether use hardware acceleration               , position: 'absolute' // element positioning             };              return react.createelement(spinner, {config: spincfg})         }     })  //...etc... 

any ideas?

looking through main.js file of react-spin https://github.com/thomasboyt/react-spin/blob/master/src/main.js, indeed contain jsx syntax, namely:

return (       <span ref="container" /> ); 

that leading parse error when browserify parsing file. use transformer such https://www.npmjs.com/package/reactify in conjunction browserify transform jsx vanilla js.

edit: reactify example

as required node_module needs transformed, need add browserify/reactify transform option package.json of react-spin. go react-spin folder , copy package json, beneath "main":

"browserify": {"transform": ["reactify"]}, 

then try run browserify command once again