解决webpack3中JS箭头函数报错

网上很多配置babel的方法，都是适用于老的webpack.config.js的格式，我搭了一个新的react项目，发现react里class下的静态函数用箭头函数声明会报错，就自己折腾了半天，终于发现了一个办法解决，不讲为什么，直接上代码

    npm install --save-dev babel-preset-es2015 npm install --save-dev babel-preset-react npm install --save-dev babel-preset-stage-0 npm install --save-dev babel-plugin-transform-class-properties

装了四个babel的包， 然后在.babelrc中

{
  "presets": [ "react","es2015","stage-0"],
  "plugins": [
    "transform-class-properties"
  ]
}

最后在webpack.config.js中

module: {
    rules: [
      {
        test: /\.js$/,
        exclude: /(node_modules|bower_components)/,
        use: {
          loader: 'babel-loader',
          options: {
            presets: ['react', 'es2015', 'stage-0'],
          }
        }
      },
    ]
  },

其实主要是第三步，这里use的写法和webpack老版本不一样。
在preset中，react放在前面可以支持箭头函数作为class的静态方法，es2015放在前面就不行。

原因还没闹明白，先记下解决办法，希望能帮助到更多人。