Babel 入門 – 次世代 JavaScript コンパイラ

技術

Babel とは、最新 JavaScript のコードを現行ブラウザでサポートされている JavaScript コードへコンパイルするツール群を指します。

JavaScript 言語仕様は今でも常に進化し続けています。JavaScript 言語仕様の策定、つまり新しい仕様を決める機関はスイスのジュネーブに本部を置く Ecma International という国際的な標準化団体です。

Ecma International 公式サイト

Ecma International 公式サイト
https://www.ecma-international.org/

JavaScriptの現在の最新バージョンは 2021年6月22日に正式制定された ECMAScript 2021 です。
言語仕様書もPDFファイルで無料公開しています。英文ですが興味のある方はこちらからダウンロードできます。
https://www.ecma-international.org/publications-and-standards/standards/ecma-262/

このように、JavaScript は常に進歩発展し続けているのですが、実行環境である各種ブラウザがリアルタイムに最新のJavaScript仕様をサポートできるわけもなく、常に後追い状態になっていますし、ブラウザ毎にどこまでサポートしているかのバラツキもあります。

現在、ほぼどのブラウザでもサポートされている JavaScript バージョンはES6(ES2015)〜ES7(ES2016)です。しかしどのブラウザも100%サポートされているかと言うと、残念ながらそうでもありません。

どのブラウザがどこまでサポート達成しているかは下のサイトで確認することができます。

ECMAScript 6 compatibility table

IE11はもう賞味期限切れの終わったブラウザなのでスルーするとして、ES2016のブラウザ別サポート率は Firefox 98 は 100%、Google Chrome 97 は 99%、Microsoft Edge 96 は 100%、Apple Safari 15.2 は 93% となっています。

このように、ブラウザ界ではようやく ES2016 をサポートしている状況ですが、コードを書く側としてはどのみちいつか ES2017 や ES2018 の時代になる事はほぼ確実なので、一足先に今各コードは最新の仕様で書きたい。これは当然のニーズです。

そこで Babel の登場です。コードは新しいEcmaバージョンのもので作成し、Babel でコンパイルしてブラウザに優しい現行バージョンまで落としたコードを生成するわけです。

エンジニアは先へ進んでおいて、後から付いて来ているブラウザに歩調を合わしてあげるために Babel が存在するのです。

それでは、Babel のインストールから学んで行きましょう。

インストールコマンドは…

おっと時間が来たようなので、今日はここまで。次回をお楽しみに!

Ads Blocker Image Powered by Code Help Pro

アドブロッカーが有効です

当サイトの閲覧はアドブロッカーをOFFにしてください

タイトルとURLをコピーしました