目前，ES6（ES2015）這樣的語法已經得到很大規模的應用，它具有更加簡潔、功能更加強大的特點，實際項目中很可能會使用采用了ES6語法的模塊，但瀏覽器對於ES6語法的支持並不完善。為了實現兼容，就需要使用轉換工具對ES6語法轉換為ES5語法，babel就是最常用的一個工具

• babel轉化語法所需依賴項：
  • babel-loader： 負責 es6語法轉化
  • babel-core： babel核心包
  • babel-preset-env：告訴babel使用哪種轉碼規則進行文件處理

• 安裝依賴

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

• 配置webpack.config.js文件

        {
        test:/\.js$/,
        exclude:/node_modules/,
        use:'babel-loader'
      }

• 新建 .babelrc文件配置轉換規則

  {
    "presets":["@babel/preset-env"]
  }

• 或者直接在webpack.config.js文件中配置規則

        {
        test:/\.js$/,
        exclude:/node_modules/,
        use:{
            loader:'babel-loader',
            options:{
              presets:['@babel/preset-env']
            }
        }
      }
   
  

Webpack 4 學習06（使用babel編譯ES6）