使用Gulp运行Webpack + Babel,但没有应用预设

时间:2016-02-03 09:21:29

标签: javascript node.js gulp webpack babeljs

我正在使用Gulp来运行Webpack,因为一些与Gulp微不足道的事情对Webpack来说很麻烦,比如多输出。但是,babel-loader似乎没有做任何事情。当我的脚本中有JSX时,我得到一个解析错误。当我使用ES6 / 7时,什么都没有改变。

这是Gulp的任务:

gulp.task('js', function() {
    return gulp.src('js/*.js')
        .pipe(webpack({
            loaders: [{
                test: /.jsx?$/,
                loader: 'babel-loader',
                exclude: /node_modules/,
                query: {
                  presets: ['es2015', 'stage-0', 'react']
                }
            }],
            output: {
                filename: '[name].js'
            }
        }))
        .pipe(gulp.dest('public/js'));
});

我有什么问题吗?

1 个答案:

答案 0 :(得分:6)

loaders不应位于配置的顶层。它必须在module之内 - 试试这个:

gulp.task('js', function() {
    return gulp.src('js/*.js')
        .pipe(webpack({
            module: {
                loaders: [{
                    test: /.jsx?$/,
                    loader: 'babel-loader',
                    exclude: /node_modules/,
                    query: {
                        presets: ['es2015', 'stage-0', 'react']
                    }
                }]
            },
            output: {
                filename: '[name].js'
            }
        }))
        .pipe(gulp.dest('public/js'));
});