Error: Missing class properties transform Error: Missing class properties transform javascript javascript

Error: Missing class properties transform


You need to install @babel/plugin-proposal-class-properties:

npm install @babel/plugin-proposal-class-properties --save-dev

or

yarn add @babel/plugin-proposal-class-properties --dev

and add the following to your Babel configuration file - usually .babelrc or babel.config.js.

"plugins": ["@babel/plugin-proposal-class-properties"],


OK, finally figured this out, in my webpack.config.js I had:

module: {    loaders: [      {        test: /\.js?$/,        exclude: /(node_modules|bower_components)/,        loaders: [          'react-hot',          'babel?presets[]=react,presets[]=es2015,presets[]=stage-0'        ]      }    ]  }

'babel?presets[]=stage-0,presets[]=react,presets[]=es2015'

Has to be treated in the same way as .babelrc, switched stage-0 to be after es2015 and it compiles perfectly.


Just in case anybody is actually still facing the same issue,The following blog post did help me:https://devblogs.microsoft.com/typescript/typescript-and-babel-7/

In my case (babel 7.9.6, typescript 3.9.2, webpack 4.43.0) I had to do the following:

  1. Run the following command:

    npm install --save-dev @babel/preset-typescript @babel/preset-env @babel/plugin-proposal-class-properties @babel/plugin-proposal-object-rest-spread
  2. Create .babelrc file (yes, I didn't have one before and it did work just fine) with the following content:

    {    "presets": [        "@babel/env",        "@babel/preset-typescript"    ],    "plugins": [        "@babel/proposal-class-properties",        "@babel/proposal-object-rest-spread"    ]}