1

I'm new to Gulp and I'm trying to transform my jsx files to js files using browserify and reactify but I'm getting and error. My gulp file looks like this:

var gulp = require('gulp'),
    nodemon = require('gulp-nodemon'),
    browserify = require('browserify'),
    reactify = require('reactify'),
    concat = require('gulp-concat'),

gulp.task('bundler', function() {
    gulp.src('public/javascript/app.jsx')
        .pipe(browserify({
            transform: 'reactify',
            extensions: ['.jsx']
        }))
        .pipe(concat('main.js'))
        .pipe(gulp.dest('./dist/javascript'));
});

gulp.task('server', function() {
    nodemon({
        script: 'server.js',
        ext: 'html js',
        watch: 'public'})
        .on('restart', function() {
            console.log('Restarted');
        });
});

gulp.task('default', ['bundler', 'server']);

But I'm getting this error:

TypeError: gulp.src(...).pipe(...).pipe is not a function
    at Gulp.<anonymous> (/Users/H/WebstormProjects/royalp/gulpfile.js:16:10)
    at module.exports (/Users/H/WebstormProjects/royalp/node_modules/orchestrator/lib/runTask.js:34:7)
    at Gulp.Orchestrator._runTask (/Users/H/WebstormProjects/royalp/node_modules/orchestrator/index.js:273:3)
    at Gulp.Orchestrator._runStep (/Users/H/WebstormProjects/royalp/node_modules/orchestrator/index.js:214:10)
    at Gulp.Orchestrator.start (/Users/H/WebstormProjects/royalp/node_modules/orchestrator/index.js:134:8)
    at /usr/local/lib/node_modules/gulp-cli/index.js:133:20
    at nextTickCallbackWith0Args (node.js:433:9)
    at process._tickCallback (node.js:362:13)
    at Function.Module.runMain (module.js:433:11)
    at startup (node.js:141:18)
/Users/H/WebstormProjects/royalp/node_modules/vinyl-fs/node_modules/readable-stream/lib/_stream_readable.js:523
    dest.end();
         ^

TypeError: dest.end is not a function
    at DestroyableTransform.onend (/Users/H/WebstormProjects/royalp/node_modules/vinyl-fs/node_modules/readable-stream/lib/_stream_readable.js:523:10)
    at DestroyableTransform.g (events.js:261:16)
    at emitNone (events.js:73:20)
    at DestroyableTransform.emit (events.js:167:7)
    at /Users/H/WebstormProjects/royalp/node_modules/vinyl-fs/node_modules/readable-stream/lib/_stream_readable.js:965:16
    at nextTickCallbackWith0Args (node.js:433:9)
    at process._tickCallback (node.js:362:13)

It was working fine before but all of a sudden it stopped working. I've been trying to fix it for hours now but I cant find the reason why it's not working, I would really appreciate some help.

corasan
  • 2,636
  • 3
  • 24
  • 41
  • The `bundler` gulp task looks fine to me, do you happen to know what you have changed prior to noticing it stopped working? (upgraded dependencies, moving around folders, etc) – Rogier Spieker Feb 18 '16 at 08:20
  • No, i didn't change anything :( but when i change the second line of bundler task to './public/javascript/*.jsx' the error says "TypeError: dest.write is not a function" – corasan Feb 18 '16 at 08:31
  • Both errors indicate there is no stream to write to, which means either `gulp.src(..)`, `browserify(..)` or `concat(..)` does not properly provide a stream. From the `dest.write` we can conclude that is at least a transform stream, which rules out `gulp.src`. I'd comment out the `.pipe(concat(..))` line, so see if the error goes away, so if it does, you know it is the `concat` you need to focus on, if the error persists, `browserify(..)` is the culprit. – Rogier Spieker Feb 18 '16 at 08:52
  • Yeah, browserify was the problem. I searched online and found a better way to transform my jsx, thank you! :) – corasan Feb 18 '16 at 16:20
  • @corosan: mind sharing the alternate solution you found? I ended up using gulp-jsx, but ran into a Parse error (within the library .. not in my gulpfile) – Prashant Mar 02 '16 at 23:50
  • @Prashant https://gist.github.com/corasan/8572cdd3bd606c7b6b58 this is the one I used. – corasan Mar 03 '16 at 10:41

0 Answers0