将浏览工作流移动到gulp任务[vueify，browserify，babelify]

Question

我正在尝试将以下浏览工作流迁移到一个单一的gulp任务中：

package.json：

"scripts": {
  "build": "browserify src/main.js > dist/build.js"
},
...
"browserify": {
  "transform": [
    "vueify",
    "babelify"
  ]
}

.babelrc文件：

{
  "presets": ["es2015"]
}

由于吞咽褐化现在维护时间更长，所以我使用这个食谱将整个工作流合并到一个单一的gulp任务中：

gulp.task('build', function () {
    var b = browserify({
        entries: './src/main.js',
        debug: true,
        transform: [vueify, babelify.configure({presets: ["es2015"]})]
    });
    return b.bundle()
        .pipe(source('build.js'))
        .pipe(buffer())
        .on('error', gutil.log)
        .pipe(gulp.dest('./dist/'));
    });

不幸的是，生成的build.js文件是不同的，只有命令npm run build生成的build.js文件才能正常运行MyVue.js应用程序。

Answer 1

我只是设法解决了这个问题。在调试器上花了一点时间之后，我发现browserify使用的转换数组包含“babelify”和“vueify”两次。

那么，所发生的事情可能是这样应用这些转换: bablify、->、vueify、->、babelify、->、vueify。我并没有花太多时间搞清楚那是怎么引爆我的东西的，因为这个问题很容易解决。

要么在package.json中指定browserify转换，要么在gulp文件中指定。不是两者都是。