模块构建失败：SyntaxError: Unexpected token with babel-plugin-transform-vue-jsx答案

【问题标题】：Module build failed: SyntaxError: Unexpected token with babel-plugin-transform-vue-jsx模块构建失败：SyntaxError: Unexpected token with babel-plugin-transform-vue-jsx
【发布时间】：2016-10-04 15:10:44
【问题描述】：

更新：vue-tables-2 现在是预编译的，因此不需要加载器。对于模板选项，建议使用作用域插槽，它也不需要任何特殊设置

我正在尝试迁移到 Vue 2，为此我需要使用 vue-tables-2 组件。我正在使用 Laravel Elixir 和 webpack 来编译我的 Vue 项目。我按照说明安装了 babel-plugin-transform-vue-jsx 及其依赖项，并在与主脚本相同的级别创建了 .babelrc。显示以下错误：

错误：./~/vue-tables-2/lib/template.jsx 模块构建失败：SyntaxError: Unexpected token (15:7)

对应的字符是

小精度，我在webpack配置中加入了这一行：

{ test: /\.jsx?$/, loader: 'babel' }

你有什么建议吗？

谢谢

【问题讨论】：

标签： webpack vue.js jsx laravel-elixir vue-tables-2

【解决方案1】：

遇到同样的问题，把webpack配置放在gulpfile.js上

elixir((mix) => {
    Elixir.webpack.mergeConfig({
        module: {
            loaders: [{
                test: /\.jsx?$/,
                loader: 'babel',
                exclude: /node_modules(?!\/(vue-tables-2|vue-pagination-2))/
            }]
        }
    });

    mix.sass('app.scss')
       .webpack('app.js');
});

【讨论】：

vue-tables-2 现在是预编译的，所以不需要加载器。对于模板选项，建议使用作用域插槽，它也不需要任何特殊设置。