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%サポートされているかと言うと、残念ながらそうでもありません。

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

Page not found · GitHub Pages

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

Ads Blocker Detected!!!

We have detected that you are using extensions to block ads. Please support us by disabling these ads blocker.

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