问题与巴贝尔预设2015年和脂肪箭头功能[重复]

当我尝试在类组件中使用胖箭头函数时,我收到以下错误。。。

ERROR in ./src/app/components/Home.js
Module build failed: SyntaxError: C:/myproject/whole/src/app/components/Home.js: Missing class properties transform.

但是,我的package.json中有正确的包

为了巴贝尔

"babel-cli": "6.26.0",
"babel-core": "6.26.0",
"babel-loader": "7.1.2",
"babel-preset-env": "1.6.0",
"babel-preset-es2015": "6.24.1",
"babel-preset-es2017": "6.24.1",
"babel-preset-react": "6.24.1",
"babel-preset-stage-0": "6.24.1",

用于网页包

"webpack": "3.5.6",
"webpack-dev-server": "2.8.2",
"webpack-merge": "4.1.0",
"webpack-node-externals": "1.6.0"

我正在为巴贝尔设置网页规则

  module: {
    rules: [
      {
        test: /\.js?$/,
        loader: 'babel-loader',
        exclude: /node_modules/,
        options: {
          presets: [
            'react',
            'stage-0',
            ['env', { targets: { browsers: ['last 2 versions'] } }]
          ]
        }
      }
    ]
  }

注意:我还尝试在“react”之前添加“es2015”。另外,尝试安装babel插件转换类属性,创建.babelrc conf文件并在那里添加插件,但没有结果。

这是我的组成部分:

import React, { Component } from 'react';

class Home extends Component {

  consoleHi = () => {
    console.log('Hi');
  };

  render() {
    return (
      <div>
        Hello
        <div>{this.consoleHi()}</div>
      </div>
    );
  }
}

export default Home;

  consoleHi() {
    console.log('Hi');
  }

我错过了什么?

记住,我在学习=)