What is {...this.props} notation? Browserify fails on that line
Closed this issue · 5 comments
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.
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?
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?
That sounds correct. If you send us that as a pull request, I'd be happy to merge it!
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 :)
Looks good, thanks!