Open catfriend opened 9 years ago
Hyperlounge
commented
9 years ago I had the same problem. I solved it by using reactify instead of babelify. Install using npm install --save-dev reactify and replace all references to "babelify" with "reactify" in the gulpfile.
magomimmo
commented
9 years ago Same as @Hyperlounge
here is the correct gulpfile.js
var gulp = require('gulp');
var browserify = require('browserify');
var reactify = require('reactify');
var source = require('vinyl-source-stream');
gulp.task('default', function(){
return browserify('./source/app.js')
.transform(reactify)
.bundle()
.pipe(source('snapterest.js'))
.pipe(gulp.dest('./build'));
});
ghufransyed
commented
9 years ago @magomimmo : your solution worked great, thanks!
backslash112
commented
9 years ago @magomimmo good job! thanks!
fedosejev
commented
9 years ago @magomimmo thanks for your help!
gerturo
commented
8 years ago Cause of the error is that Babel now uses a plugin system. These plugins must be installed separately and then enabled in the gulpfile. An alternative solution to the above error would be:
npm install --save-dev babel-preset-react
and then in the gulpfile:
.transform(babelify, { presets: ["react"] } )
car3oon
commented
8 years ago @gerturo thanks. It's working properly now.
sandergroen
commented
8 years ago @gerturo thanks, that does the job for me to.
fedosejev
commented
8 years ago @gerturo :+1:
etnichols
commented
8 years ago @magomimmo @gerturo Thanks for the fixes! Both worked for me.
artemrogov
commented
8 years ago Thank You! Gerturo
tputraa
commented
6 years ago thanks m8~
I sent this in an email yesterday:
RE: [react-essentials] error on npm start (#15) Elizabeth Kari 11/03/15 To: fedosejevreact-essentials I have another question. I threw out my previous version, and started again. Everything seemed to be going fine. Chapter 2, Building With Gulp.js. I followed the instructions for installing Gulp, no problem. The next instruction is npm install --save-dev babelify. No problem. From my terminal: snapterest:$ npm install --save-dev babelify Next up, npm install --save-dev vinyl-source-stream. Again, no problem (from terminal: snapterest:$ npm install --save-dev vinyl-source-stream). I then ran Gulp as instructed, and got the expected result. At this point everything was working as expected. I added the current version of React, the code to app.js, and ran Gulp. I created the element, and had the expected html on screen, but not “
” in the developer tools. I continued, but the text is not appearing on screen as expected. At the end of the chapter I double checked mine against your example, and while the code I typed matched, there is a major file discrepancy:build gulpfile.js node_modules package.json source
I have the node modules folder in my app, whereas your example does not. Inside my node modules folder:
babelify browserify gulp react react-dom vinyl-source-stream
I followed the instructions. If these are not supposed to be in the snapterest folder, and since they're not in yours I'm gathering that is not the case, then where are they supposed to be? How should I proceed?
Having not heard back, I deleted the node modules folder from snapterest. I then reinstalled all those node modules in my main directory. I double checked to make sure the rest of my code was matching yours. After doing so I ran gulp again. Failure: snapterest:$ gulp [12:35:44] Using gulpfile ~/snapterest/gulpfile.js [12:35:44] Starting 'default'... events.js:141 throw er; // Unhandled 'error' event ^
SyntaxError: /Users/elizabethakari/snapterest/source/app.js: Unexpected token (4:18) 2 | var ReactDOM = require('react-dom'); 3 |