add babel/polyfill in Gulp with Babelify and Browserify

Question

I am using Babel and Browserify with Gulp. I want to add babel-polyfill into my project, but it is hard to find what I want to do on internet.
This is node_modules I installed:

vinyl-source-stream
vinyl-buffer
gulp
gulp-sourcemaps
browserify
babelify
babel-polyfill

And this is my gulpfile.js:

var source = require('vinyl-source-stream');
var buffer = require('vinyl-buffer');
var gulp = require('gulp');
var sourcemaps = require('gulp-sourcemaps');
var browserify = require('browserify');
var babelify = require('babelify');

gulp.task('default', function() {
    return browserify('./source/app.js')
    .transform(babelify, { presets: ["es2015", "react"] })
    .bundle()
    .pipe(source('app.js'))
    .pipe(buffer())
    .pipe(sourcemaps.init({loadMaps: true}))
    .pipe(sourcemaps.write('./'))
    .pipe(gulp.dest('./dist'));
});

I tried to add babel-polyfill like other people said but everything is not worked on me. I think it's getting harder and harder when I using gulp + babelify + browserify. next time, I should use webpack.

Anyway, back to the point, is there a way to add babel-polyfill into Gulp + Babelify + Browserify?

I spent hours but I'm still working on it.

Anyone gimme a advice and that will be very appreciated ;)

youngwind youngwind · Accepted Answer · 2016-04-24T07:27:23

You can add 'babel-polyfill' directly through script tag in the html. Another way is require('babel-polyfill') is the begin of all your code.(Not in the gulp!) See this. https://babeljs.io/docs/usage/polyfill/

add babel/polyfill in Gulp with Babelify and Browserify

1 Answers