Babel 7へのマイグレーション方法まとめ
Babel 7がリリースされましたね。
記事「最新版で学ぶwebpack 4入門 - Babel 7でES2018環境の構築」では、webpack 4とBabel 7の連携について、最新版の情報にすべて書き直しました。サンプルもすべてBabel 7対応しています。
マイグレーションするなかで気づいた点を紹介しようと思います。
Babel 7の主な新機能
- TypeScriptをサポート
- babel.config.jsが新設. envで制御可能に。
- .babelrc や package.json を置き換えるものではない
- globでプリセット指定が可能なoverrideが追加
- polyfillを必要分だけ自動的に導入(実験機能)
導入して気づいた、Babel 6→7の破壊的変更まとめ
-
babel-core
から@babel/core
に名前が変更 - プリセットの設定名も変更
-
babel-preset-env
が@babel/preset-env
に変更された -
babel-preset-react
が@babel/preset-react
に変更された
-
-
@babel/preset-env
で、モジュールがデフォルトでES Modules対応する- いままでは
import
文が忌まわしきrequire()
メソッドに変換されるのを防ぐため、明示的に{module: true}
を設定していたが、明示的に指定しなくてOK
- いままでは
- ポリフィルの扱いも変更
- なんか自動的にプリフィルを当ててくれるらしい(要検証)
古い記事の手順だと最新版を導入できないので注意。
公式からアップグレードツールが便利
とりあえず、グローバルに入れる。
sudo npm i -g babel-upgrade
Babel 6のプロジェクトでドンと入力。
babel-upgrade --write --install
これで、package.jsonや.babelrcのほとんどはアップグレードできる。
ただし、webpack.config.jsonまでは管理してくれないので、自前で修正する必要あり。
Babelのテーマ曲
babel/SONG.md at master · babel/babel
に歌詞が公開されている。YouTubeでは歌声付きで視聴できる。
Author And Source
この問題について(Babel 7へのマイグレーション方法まとめ), 我々は、より多くの情報をここで見つけました https://qiita.com/clockmaker/items/2692022d5a036471c982著者帰属:元の著者の情報は、元のURLに含まれています。著作権は原作者に属する。
Content is automatically searched and collected through network algorithms . If there is a violation . Please contact us . We will adjust (correct author information ,or delete content ) as soon as possible .