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

babel logo

Medium is a weird place for this but I figured it will probably show up in searches, hopefully help people save time.

This is the error:

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

I saw this when setting up a new app using MobX with ReactJS and Babel (>7).

Here is what you need to do to enable the @decorator syntax.

1. Add the babel package plugin-proposal-decorators.

yarn add @babel/plugin-proposal-decorators

2. Add the following configuration to your babel.config.js file plugins section.

[
   require(‘@babel/plugin-proposal-decorators’).default,
   {
      legacy: true
   }
],

Or if you use .babelrc add this configuration to the "plugins" section

[“@babel/plugin-proposal-decorators”, { “legacy”: true }],

Please note that I didn’t test this .babelrc configuration but unlike the babel.config.js configuration this is actually documented on babel’s page here https://babeljs.io/docs/en/babel-plugin-proposal-decorators.

3. Finally you must restart the webpack-dev-server.