Webpack - неожиданный токен для функции Arrow в классе

Question

Я использую webpack 4 с экспресс-реагированием и babel 7. Это всегда дает мне непредвиденную ошибку токена, например:

SyntaxError: /var/www/nodejs/modules/react/ShareStates.jsx: Unexpected token (11:15)    9 |    10 | export class ShareStatesContextProvider extends Component {
> 11 |     updatePath = (pathInput) => {
     |                
^   12 |         this.setState({   
13 |             path: pathInput   
14 |         })

Я уже исследовал в Интернете, и те сказали, что мне нужноесть @ babel / plugin-offer-class-properties. Я добавил это, и это не работает для меня. Кроме того, эти результаты около 2017 года. Есть ли какой-либо актуальный ответ на этот вопрос?

Спасибо

Код

import React, { Component, createContext } from 'react';
//use context API reference
// https://www.taniarascia.com/using-context-api-in-react/

export const ShareStatesContext = createContext({
    path: "",
    updatePath: () => {}
});

export class ShareStatesContextProvider extends Component {
    updatePath = (pathInput) => {
        this.setState({
            path: pathInput
        })
    }

    state = {
        path: "",
        updatePath: this.updatePath
    }

    render() {
        return (
            <ShareStatesContext.Provider value={this.state}>
                {this.props.children}
            </ShareStatesContext.Provider>
        );
    }
}

Файл webpacke.config.js

var path = require('path');
var webpack = require('webpack');

module.exports = {
    entry: path.resolve(__dirname, './client.js'),
    output: {
        filename: 'bundle.js', 
        path: path.join(__dirname, 'public')
    },
    watch: true, 
    watchOptions: {
        aggregateTimeout: 300,
        poll: 1000, 
        ignored: /node_modules/
    },
    performance: {
        hints: false
    },
    mode: process.env.environment,
    resolve: { 
        extensions: ['.jsx', '.js']
    },
    plugins: [
        new webpack.DefinePlugin({
            'process.props': JSON.stringify(process.props),
            'process.env': {
                NODE_ENV: JSON.stringify(process.env.environment)
            }
        })
    ],
    module: {
        rules: [
            {
                test: /\.jsx$/,
                exclude: /node_modules/,
                use: {
                    loader: 'babel-loader',
                    options: {
                        presets: [
                            '@babel/preset-react', 
                            '@babel/preset-env'
                        ],
                        plugins: [
                            "@babel/plugin-transform-arrow-functions", 
                            '@babel/plugin-proposal-class-properties']
                    }
                }
            },
        ]
    }
}

Не могли бы вы помочь мне выяснить, что янужно добавить, чтобы оно работало?

package.json - это

{
  "name": "nodejs",
  "version": "0.0.0",
  "private": true,
  "scripts": {
    "start": "npm-run-all --parallel watch:server watch:build",
    "watch:build": "webpack --watch --config ./webpack.config.js",
    "watch:server": "nodemon --inspect=0.0.0.0 ./bin/www"
  },
  "dependencies": {
    "abort-controller": "^3.0.0",
    "apollo-boost": "^0.4.4",
    "babel-core": "^6.26.3",
    "babel-loader": "^8.0.6",
    "babel-preset-env": "^1.7.0",
    "babel-preset-react": "^6.24.1",
    "babel-register": "^6.26.0",
    "bluebird": "^3.7.1",
    "cookie-parser": "~1.4.4",
    "core-js": "^3.3.6",
    "cors": "^2.8.5",
    "debug": "~2.6.9",
    "express": "~4.16.1",
    "express-graphql": "^0.9.0",
    "express-session": "^1.17.0",
    "graphql": "^14.5.8",
    "graphql-tag": "^2.10.1",
    "graphql-type-json": "^0.3.0",
    "hjs": "~0.0.6",
    "http-errors": "~1.6.3",
    "isomorphic-fetch": "^2.2.1",
    "js-cookie": "^2.2.1",
    "jsonwebtoken": "^8.5.1",
    "ldapjs": "^1.0.2",
    "luxon": "^1.21.1",
    "morgan": "~1.9.1",
    "nodemon": "^1.19.4",
    "npm-run-all": "^4.1.5",
    "react": "^16.11.0",
    "react-bootstrap": "^1.0.0-beta.14",
    "react-dom": "^16.11.0",
    "regenerator-runtime": "^0.13.3",
    "uuid": "^3.3.3"
  },
  "devDependencies": {
    "@babel/core": "^7.7.0",
    "@babel/plugin-proposal-class-properties": "^7.7.0",
    "@babel/plugin-transform-arrow-functions": "^7.2.0",
    "@babel/preset-env": "^7.7.1",
    "@babel/preset-react": "^7.7.0",
    "webpack": "^4.41.2",
    "webpack-cli": "^3.3.10"
  }
}