gulp + react + babel + browserify

var gulp = require('gulp');
var babel = require("gulp-babel");
var browserify = require('browserify');
var gutil = require('gulp-util');
var source = require('vinyl-source-stream');
var buffer = require('vinyl-buffer');
var watch = require('gulp-watch');
var gutil = require('gulp-util');
const babelify = require('babelify');


function transform() {
    return gulp.src('./src/*.js')
        .pipe(babel({
            presets: ["@babel/preset-env", "@babel/preset-react"]
        }))
        .pipe(gulp.dest('dist'));
}

function bundle() {
    return browserify('./src/index.js',
        { bundleExternal: true, external: ['react', 'react-dom'] })
        .transform(babelify, { presets: ["@babel/preset-env", "@babel/preset-react"] })
        .bundle()
        .on('error', gutil.log)
        .pipe(source('index.js'))
        .pipe(buffer())
        .pipe(gulp.dest('./dist/'));

}

function bundleprimereact() {
    //, { ignore: [require.resolve('react')] }
    return browserify('./node_modules/primereact/datatable',
        { external: ['react', 'react-dom'] })
        .bundle()
        .on('error', gutil.log)
        .pipe(source('primereact_datatable.js'))
        .pipe(buffer())
        .pipe(gulp.dest('./dist/'))

}

exports.transform = transform;

exports.bundle = bundle;

exports.bundleprimereact = bundleprimereact;