babel-polyfillと@babel/polyfillの違いってなんだ?備忘録


背景

Bugsnagでオブジェクトは 'finally' プロパティまたはメソッドをサポートしていませんとエラーが吐かれることから調査をしていた。どうやらnew Promise.finally()がIE非対応なことに起因しているようである。MDN - Promise.prototype.finally()

そこで、package.jsonを確認してみると、以下のようになっていた。

  • babel-polyfillは入っているじゃないか
  • 最後のアップデートは3年前って化石プロジェクトか?w

普段あまり関わらないプロジェクトなので、たまに触りにくると、こういうものを見つけたりする。

さて、ここである疑問が浮かんだ。

babel-polyfill@babel/polyfillの違いってなんだ?

調べて見た

babel-polyfillとググっても、結果としてヒットするのは@babel/polyfillのほうだ。

同じものなのか?と思って、yarn upgrade babel-polyfill --latestとやってみるも、更新されない。(*後から考えるとそりゃそうだってツッコミたくなるが、スルーしてください)

Babelのバージョン一覧を確認してみる

どうやら同じである。ということは、メジャーアップデートの際に何かしら変更があったのか?

ということで、Babel 7 Releasedを記事を読んでみた。そして下の方にスクロールすると...

あった。これか

Major Breaking Change

Move us to the @babel namespace by switching to using "scoped" packages (details). This helps differentiate official packages, so babel-core becomes @babel/core (and no squatting)

なるほど、バージョンが7.0.0になった時に、名前空間が変わったようだ。これが影響して、--latestをつけただけでは単純にパッケージが@babel/polyfillに切り替わらなかったのである。

結論

  • 同じパッケージであるが、バージョン7.0.0をきっかけに名前空間が変わっている
  • パッケージの更新をするには、改めてyarn add -D @babel/polyfillをしたのち、yarn remove babel-polyfillとなる。

*ただし、Babel7.4.0から@babel/polyfillは非推奨になっているので、ご了承ください
=> Babel7.4で非推奨になったbabel/polyfillの代替手段と設定方法