webpack編譯es6

一、webpack安裝

npm install webpack -g //全局安裝
npm install webpack --save-dev //安裝到項目

二、安裝webpack加載器（babel-loader）                                   loades列表：http://webpack.github.io/docs/list-of-loaders.html

npm install babel-loader --save-dev //安裝 babel-loader
npm install babel-preset-es2015 --sava-dev //安裝轉碼規則

三、webpack配置

var path = require('path');
module.exports = {
  entry: "./main.js",//入口文件
  output: {//打包輸出的文件
    path: __dirname,
    filename: "bundle.js"
  },
  module: {
    loaders: [
      {
        test: path.join(__dirname, 'es6'),
        loader: 'babel-loader',
        query: {
          presets: ['es2015']
        }
      }
    ]
  },
  resolve: {// 現在你require文件的時候可以直接使用require('file')，不用使用require('file.coffee')
    extensions: ['.js', '.json', '.coffee']
  }
}

 四、運行

webpack

目錄結構：