Support for the experimental syntax 'classProperties' isn't currently enabled

Projects using advanced syntax error,

Error Messages

SyntaxError: E:\workdata\webpackVue\src\index.js: Support for the experimental syntax 'classProperties' isn't currently enabled (22:8):

20 |
21 | class Dog {
> 22 | name = 'bigWhite'
| ^
23 | static color = 'yellow'
24 | }
25 | const d = new Dog()

Add @babel/plugin-proposal-class-properties (https://git.io/vb4SL) to the 'plugins' section of your Babel config to enable transformation.

This is because a high-level syntax to write js, the browser does not support, you need to install the plug-babel and configuration, an error message will prompt us here to install the plug

Installation npm i @ babel / plugin-proposal-class-properties in the project -D

In the configuration file webpac.config.js

module: {
    rules: [{
      test: /\.css$/,
      use: ['style-loader', 'css-loader']
    }, {
      test: /\.js$/,
      use: {
        loader: 'babel-loader',
        options: {
          presets: ['@babel/env'],
          plugins: ['@babel/plugin-proposal-class-properties']
        }
      }
    }]
  },

After you configure will be able to function properly, and also into common grammar