使用Webpack和Babel将ES6代码转换为ES5的完整流程

npm install webpack --save-dev 

npm install --save-dev babel-core babel-preset-es2015 
npm install --save-dev babel-loader 

源代码与配置文件编写

let a = 111; 
let b = 222; 
var xxx = (c,d) => c*d; 
console.log(xxx(a,b)); 

module.exports = { 
  entry: './src/app.js', 
  output: { 
    path: './bin', 
    filename: 'app.bundle.js', 
  }, 
  module: { 
    loaders: [{ 
      test: /\.js$/, 
      exclude: /node_modules/, 
      loader: 'babel-loader' 
    }] 
  } 
} 

{ "presets": [ "es2015" ] } 

执行打包与结果验证

function(module, exports) { 
 
"use strict"; 
 
var a = 111; 
var b = 222; 
var xxx = function xxx(c, d) { 
 return c * d; 
}; 
console.log(xxx(a, b));