Laravel 5.4のLaravel Mixでスプレッド構文(…)を使うとSyntax Error: Unexpected tokenが出る

Laravel 5.4のLaravel Mixを使ってVue.jsで開発している際に、スプレッド構文(...mapGetters({ })...の部分)が上手くビルドできませんでした。

babel-plugin-transform-object-rest-spreadのnpmパッケージを利用して、.bablercにpluginとして追記することで解決できます。

まずコマンドラインからbabel-plugin-transform-object-rest-spreadを入れ、

npm install --save-dev babel-plugin-transform-object-rest-spread

プロジェクトのルートにある.babelrc(なければ作成してください)に、

{
  "plugins": ["transform-object-rest-spread"]
}

を記述します。既に他の記述がある場合はpluginsに追記してください。

迷走していた私はnpm run watchを走らせたままエラーを出し続けて時間を無駄にしてしまったので、watchを使っている方は忘れずにwatchを止めてnpm run devし直しましょう。

参考

can’t compile object spread operator unexpected token error · Issue #76 · JeffreyWay/laravel-mix | GitHub