WebPACKのES6ターンES5を達成

ES6はES5に変換達成するためのWebPACK

プラグインをインストールします。

npm install --save-dev babel-loader @babel/core @babel/preset-env

コンフィギュレーション

ではwebpack.config.jsモジュールのルール、新しいローダーを追加

{
   test: /\.js/, //babel转化es6到es5
   exclude: /node_modules/,
   use: {
     loader: "babel-loader",
     options: {
       presets: [
         [
           "@babel/preset-env",
           {
             useBuiltIns: "usage",
             corejs: 2
           }
         ]
       ]
     } 
   }
 }

• 現在、それが持っています

• 欠点は、彼はその後、我々は第二の方法を使用することができ、変数ウィンドウのためのいくつかの汚染の原因となります

第二の方法

インストール

npm install --save-dev babel-loader @babel/core @babel/plugin-transform-runtime @babel/runtime

使用

webpack.config.js追加ルールは、モジュール内のルールに従います

{
  test: /\.js/, //babel转化es6到es5
  exclude: /node_modules/,
  use: {
    loader: "babel-loader",
    options: {
      // presets: [
      //   [
      //     "@babel/preset-env",
      //     {
      //       useBuiltIns: "usage",
      //       corejs: 2
      //     }
      //   ]
      // ],
      plugins: ["@babel/plugin-transform-runtime"]
    }
  }
}

彼らの通常の開発は、めったにプロトタイプチェーンに遭遇していない場合は、このアプローチはまた、あなたは、いくつかの公共図書館を書きたい場合は、以下のことをお勧めします、エスケープされることはありませんプロトタイプチェーン上のメソッドの対応する欠点を持っている、それが使用することです@babel/preset-env