Polyfill, Babel

2036 ワード
babel polyfill テキストリンク
JavaScriptの使用中に発生した問題
  • javascriptは、さまざまなエンジンと異なるバージョンのため、すべてのブラウザで互換性のない構造です.したがって、最新のJavaScriptを使用するために提供される方法の1つはpolifill、babel、webpackであり、最新のJavaScriptコードをブラウザが知っている形式に変換することです.
    • JavaScript構築とコード変換
  • Webpackを使用して構築され、JavaScript、
    • が配備されます.
  • このとき、Babelは最新のJavaScriptコードをコンパイル時に互換性のあるJavaScriptコードに変換する.
  • 実行時にBrowserがサポートしていない関数
    • をチェックする
    Polifill,Babelの役割
    polyfillとbabelを併用すると、モダンなJavaScriptコードを古いブラウザでも使えるように変更できる点が似ていると考えられます.
    でも、
    1.BabelはES 6+コードをES 5に変換します.
    2.PolifillはES 5でサポートされていないコードを変換します.
    ES 6のメソッドまたは作成者がES 5を持っていないため、コード変換ができない場合、PolyfillはES 5変換を実行します.
  • の下のbableのtranspilerの過程で、記入する必要がある部分の動作を内部アシスタント関数に変換することを参照してください.
    • Babel
  • Babelでは、古いブラウザでモダン(現代)コードを記述できます.
  • ECMAScript 2015+コードを以前のバージョンと互換性のあるJavaScriptバージョンに変換するために使用されます.
  • ES 6+コードをES 5に変換するツール
  • バーベルのTranspilerは、標準を標準に合致するコードに変換するコンパイラです.
  • トランスミッション
  • バーベルはコード書き換えの変換プログラム
    • を提供する.
  • を実行して開発するコードは、既存のコード規格に適合するコード
    • になる.
  • Webパッケージのような現代プロジェクト構築システムは、コード修正のたびにファイル
    • を自動的に変換する.
  • 、例えば、変換矢印関数またはes 6がサポートする構文
    • // 변환 전 
const helloBabel = () => {
  return 'world';
}

// 변환 후 
var helloBabel = function helloBabel() {
  return 'world';
}
    Polyfill
  • Polyfillは、古いブラウザでモダン(現代)コードを記述することができます.
  • 行のtranspiler過程において、充填が必要な部分動作を内部アシスタント関数
    • に変換する.
    たとえば、Promise、Objectです.assign等のSyntax置換ES 5(babel不可)がない
  • タイプ
  • コアjs–複数の集約ペン
    • を提供
  • polyfill.io–ブラウザに基づいて多段テキストスクリプトを提供
  • ユーザー-エージェントベース
    • // 변환 전
new Promise(resolve => resolve(1))

// 변환 후
var _promise = require("babel-runtime/core-js/promise");

var _promise2 = _interopRequireDefault(_promise);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

new _promise2.default(function (resolve) {
  return resolve(1);
});
    Webpack
  • JavaScript構築システム
    • バージョン
  • を構築する場合、パッケージを使用してSPAを作成します.
  • 開発サーバ
    • なぜSpringBootのjarは直接実行できるのですか?
    仮想マシンによる個人LNMP開発環境の構築