search

Khan / react-components

khan.github.io/react-components/
MIT License
1.01k stars 99 forks source link

What is {...this.props} notation? Browserify fails on that line #25

Closed tobice closed 9 years ago

tobice commented 9 years ago

I tried to use react-components in my app but I haven't managed to compile it with the rest of my code using browserify + reactify. It fails on this notation {...this.props} for example in timeout-transition-group.jsx. 

Error: Parsing file  ..../node_modules/react-components/js/timeout-transition-group.jsx: Line 201: Unexpected token {

What does that notation do? Is it part of ES6? I tried to add es6: true to reactify options but it didn't help. It's not even recognized by my IDE (WebStorm) although ES6 should be supported.

xymostech commented 9 years ago

The {...this.props} operator is part of the JSX transform, but it was introduced in version 0.12 (It's called the spread operator: 0.12 release notes). Maybe you're using an old version of the JSX transform?

tobice commented 9 years ago

Okay, I discovered the problem: browserify transforms are not automatically applied on files inside node_modules folder unless it is specifically asked for inside module's package.json. If I added to your module's package.json following line, it started working:

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

Could you do that? Or what would you recommend me to do to include the library into my code?

ariabuckles commented 9 years ago

That sounds correct. If you send us that as a pull request, I'd be happy to merge it!

tobice commented 9 years ago

The pull request is waiting to be merged. This is actually my very first pull request here at GitHub so I hope I did everything right :)

joelburget commented 9 years ago

Looks good, thanks!