WebPack 2.x replace loader to rules

[jboonf]

Hi,
Webpack 2.x將loader換成rules
webpack.config.js的內容需要修改
另外隨版本開發，webpack-cli獨立出來，因此需要獨立安裝webpack-cli
babel-preset-es2015即將過期，要改裝babel-preset-env，並且在webpack.config.js中要把
presets: ['es2015', 'react'],改成presets: ["env", "react"],

[Jackmoo]

遇到同樣的問題 註記

module: {
  	// loaders 則是放欲使用的 loaders，在這邊是使用 babel-loader 將所有 .js（這邊用到正則式）相關檔案（排除了 npm 安裝的套件位置 node_modules）轉譯成瀏覽器可以閱讀的 JavaScript。preset 則是使用的 babel 轉譯規則，這邊使用 react、es2015。若是已經單獨使用 .babelrc 作為 presets 設定的話，則可以省略 query
    loaders: [                             // <<<<<<<<<<<<<<<< loaders需要改為 rules
      {
        test: /\.js$/,
        exclude: /node_modules/,      
        loader: 'babel-loader',
        query: {
          presets: ['es2015', 'react'],    // <<<<<<<<<<<<<<<<此處需要安裝babel-present-env後改為 ["env", "react"],
        },
      },
    ],
  },