I am trying to use gulp and browserify to transform my .jsx files into .js files.
var gulp = require('gulp');
var browserify = require('browserify');
var reactify = require('reactify');
gulp.task('js', function () {
browserify('public/javascripts/src/app.jsx')
.transform(reactify)
.bundle()
.pipe(gulp.dest('public/javascripts/dist'))
});
```
The above threw Arguments to path.resolve must be strings. I managed to get around it by using vinyl-source-stream
var source = require('vinyl-source-stream');
...
.bundle()
.source('app.js')
...
Why does this work? I am fairly new to nodejs and gulp. After reading the README of the project and the source code, I am still confused. Any help?
I think that reading this article gulp The vision, history, and future of the project can help you to clarify a few concepts.
Basically you can say that vinyl-source-stream convert the readable stream you get from browserify into a vinyl stream that is what gulp is expecting to get.
A vinyl stream is a Virtual file format, and it is fundamental for Gulp. Thanks to this vinyl streams Gulp doesn't need to write a temporal file between different transformations. And this is one of the main advantages it has over Grunt.
This module is just a bridge that makes it simple to use conventional text streams such as this in combination with gulp.