Babelify not transforming arrow function in Vue Components

Question

I am trying to use Vue Single File Components with a Gulp build system.

Gulp should transform the files with Vueify and Babel, but neither of them are transforming arrow functions.

package.json

{
  "dependencies": {
    "@babel/cli": "7.4.4",
    "@babel/core": "7.4.5",
    "@babel/plugin-transform-arrow-functions": "7.2.0",
    "@babel/plugin-transform-runtime": "7.4.4",
    "@babel/preset-env": "7.5.2",
    "@babel/runtime": "7.5.2",
    "@vue/babel-preset-app": "3.7.0",
    "babelify": "10.0.0",
    "browserify": "16.2.3",
    "core-js": "3.1.4",
    "gulp": "4.0.1",
    "gulp-babel": "8.0.0",
    "gulp-concat": "2.6.1",
    "gulp-jshint": "2.1.0",
    "gulp-nodemon": "2.4.2",
    "gulp-sass": "4.0.2",
    "gulp-sourcemaps": "2.6.5",
    "gulp-uglify": "3.0.2",
    "gulp-watch": "5.0.1",
    "node-sass": "4.11.0",
    "regenerator-runtime": "0.13.2",
    "uglifyify": "5.0.1",
    "vinyl-buffer": "1.0.1",
    "vinyl-source-stream": "2.0.0",
    "vue": "2.6.10",
    "vue-script2": "2.1.0",
    "vueify": "9.4.1"
  },
  "engines": {
    "node": "11.12.0",
    "npm": "6.9.0"
  },
}

gulpfile.js

   gulp.task('script:' + pageName, function(done) {
      var b = browserify(__dirname + '/public/js/vue/entry/'+pageName+'.js', {
        debug: true, standalone: 'Bundle'
      });
      return b
        .transform(vueify)
        .transform('babelify', {
          presets: ['@babel/preset-env', '@vue/babel-preset-app'],
          plugins: ['@babel/plugin-transform-arrow-functions'] 
        })
        .bundle()
        .pipe(source(pageName + '.min.js'))
        .pipe(buffer())
        .pipe(gulp.dest(paths.js.output));
      done();
    });

myPage.vue

<script>
  module.exports = {
    data: ()=>{
      return {};
    }
  }
</script>

The output inside myPage.min.js

module.exports = {
  data: ()=>{
    return {};
  }
}

Notice the arrow function did not get transformed.