Support for the experimental syntax 'decorators-legacy' isn't currently enabled

Question

I am getting the above error when I am using mobx-react and while trying to use annotations.Here I am using .js and not .ts. All the solutions provided earlier not successful for me.

import React, { Component } from 'react';
import { withRouter, Redirect } from 'react-router-dom';
import { observable, action } from 'mobx';
import { inject, observer } from 'mobx-react';

@inject('authStore')
@withRouter
@observer
class Login extends Component {

   componentWillUnmount() {
       this.props.authStore.reset();
   }

}

My error is

Answer 1

If you are using babel then you need to install and use @babel/plugin-proposal-decorators with legacy mode enabled.

For example, plugins section of .babelrc:

    "plugins": [
      ["@babel/plugin-proposal-decorators", { "legacy": true }]
    ]