webpack＋bableでIE11が動かない！？

相変わらず最近JS書いているのですが、慣れ親しんだ（？）classとか使いたくて書き方を変えようとしました。

で、いろいろGoogle先生に教えてもらったところ、どうやらモダンブラウザでないとclassとは使えないっつー話。

IEよ、やはりオマエか

まぁ、環境的にも時代的にもIEはムシしても良さげだったのだけれども、後になってゴチャゴチャゴニョゴニョIE問題発生も困るので、webpack+babelでトランスパイルしてIEでも問題ないようにしておこうかと。

で、webpack.config.jsでbabelを読み込んで、npm run dev してみたら・・・構文エラー

開発者ツールで見たら、アロー関数がエラー原因。

(()=>{ ... })();

なにそれ？ムカつく〜babelちゃんと仕事しろよ！どうすんだよこれ・・・と半狂乱になりかけたけれども、いつものように親切な人がいて助かった！

https://qiita.com/yuto-ono/items/19ca9cd03225b5d88a1c

まさに自分のところもこれでした。webpack.config.jsで

module.exports = {

  mode: "development",
 
  entry: ["./assets/js/index.js"],
 
  output: {
    filename: "app.js",
    path: path.join(__dirname, 'htdocs/js'),
    environment: {
      arrowFunction: false　//<--- これでアロー関数を無効化
 
 
    }
},
.
.
.

めでたくIEでもエラー無く実行可能になりました！