如何使用咽喉和咽喉-webpack？

Question

我正在尝试编译ES6 js文件。我在咽喉管道中使用吸口剂和吸口剂。

gulp.task('default', function () {
return gulp.src('js/app.js')
    .pipe(traceur())
        .pipe(webpack())
        .pipe(concat('app.js'))
            .pipe(rename({suffix: '.min'}))
            .pipe(uglify())
        .pipe(gulp.dest('build/js'));

在狼吞虎咽的时候。我接受错误:出乎意料的保留词。您可能需要一个适当的加载程序来处理此文件类型。在包含"class“字的行上。(ES6语法)

我不知道怎么一起使用这些插件？

Answer 1

这个设置将把'js/app.js'传递给traceur，但是没有任何相关的文件，webpack将从这个转移的文件开始，并将其余的作为正常的JS处理。实际上，我甚至不确定webpack会不会得到app.js的跨程序版本。

正确的方法是以webpack为主要入口点，并告诉webpack把它遇到的所有文件都传送出去。我还建议使用Webpack的uglifyjs逻辑，而不是在事后吞咽。

gulp.task('default', function () {
    return gulp.src('js/app.js')
        .pipe(webpack({
            module: {
                loaders: [{
                    test: /^(?!.*(bower_components|node_modules))+.+\.js$/,
                    loader: 'traceur'
                }]
            },
            plugins: [
                new webpack.optimize.UglifyJsPlugin()
            ]
        })
        .pipe(concat('app.js'))
        .pipe(rename({suffix: '.min'}))
        .pipe(gulp.dest('build/js'));
});