Laravel-Mix4でもIEとか古いブラウザになるべく楽に対応したい

背景

• Laravel-Mix4でBabelの設定に躓いた
• 設定ファイルもなるべく書かずに楽をしたい

結論

webpack.mix.jsでbabelメソッドを使う

コード

// webpack.mix.js
let mix = require('laravel-mix');

mix
  .js('resources/js/*.js', 'assets/js/app.js')
  .babel('assets/js/app.js', 'assets/js/app.js');

ただしコンパイルが重いのでmix.inProduction()を使用して本番環境のコンパイルのみBabelを噛ませるようにすれば、開発もスムーズになりそう。

参考

Laravel公式ドキュメント
Convert ES6 to ES2015 using babel and laravel-mix