今回はJavaScriptのトランスパイルについて。
JavaSciprtではwebpackでコンパイルなどをする時に同時にトランスパイルという処理を行います。
トランスパイルとは？
主にES2015以降の仕様で記述したJavaScriptが古いブラウザなどで動かなく危険性があるため、互換性のあるコードに変換をする処理。
ES2015以降では
- let,constなどの変数定義
- ブロックスコープ
- アロー関数
- thisの参照
- Class構文
- …etc
などの便利な機能が使えるため。
一般的にはBabelというライブラリを使います。
サンプルコード
https://github.com/umanari145/front_end_javascript/tree/master/webpack_sample
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
module:{ rules:[ { //jsに対してbabel-loaderを適用 test:/\.js$/, use:{ loader:'babel-loader', //使用するbabel-loaderの設定 options:{ presets:['@babel/preset-env'] } } } ] |
参考リンク
[…] JavaScriptのトランスパイルについて […]