{"id":572,"hash":"7af09a0bbbea8f724b68b37a02bc3572de3f893086fef64aaa07fcd7b6ffe41d","pattern":"Syntax error - Support for the experimental syntax 'decorators-legacy' isn't currently enabled","full_message":"I'm trying to build JS react project with decorators. My .babelrc looks like this:\n\n{\n  \"presets\": [\n    \"@babel/preset-env\",\n    \"@babel/preset-react\",\n\n  ],\n  \"plugins\": [\n    \"@babel/plugin-transform-runtime\",\n    \"@babel/plugin-transform-object-assign\",\n    [\n      \"@babel/plugin-proposal-decorators\",\n      {\n        \"legacy\": true\n      }\n    ],\n    [\"@babel/plugin-proposal-class-properties\", { \"loose\": true }]\n  ]\n}\n\nAdding  @babel/plugin-proposal-decorators problems appears again.\n\nI am using babel 7, webpack 4 and react 16.5\n\nwebpack.config.js:\n\nconst path = require(\"path\");\nconst webpack = require(\"webpack\");\nconst componentName = \"reports-desktop\";\nconst publicFolderRelativePath = \"../../../../../../public/js\";\nconst ignorePlugin = new webpack.IgnorePlugin(/^\\.\\/locale$/, /moment$/);\n\nmodule.exports = {\n    entry: './reports-desktop.js'\n    ,\n    output: {\n        path: path.resolve(__dirname, publicFolderRelativePath),\n        filename: `${componentName}.js`\n    },\n    module: {\n        rules: [\n            {\n                test: /\\.js$/,\n                exclude: /node_modules/,\n                use: {\n                    loader: \"babel-loader\"\n                }\n            }\n        ]\n    },\n    plugins: [\n        ignorePlugin\n    ]\n};\n\npackage.json: \n\n{\n  \"name\": \"captain\",\n  \"version\": \"1.0.0\",\n  \"description\": \"\",\n  \"main\": \"index.js\",\n  \"scripts\": {\n    \"watch\": \"webpack -w --mode development --progress --color --display-error-details\",\n    \"build\": \"webpack --mode production\"\n  },\n  \"keywords\": [],\n  \"author\": \"\",\n  \"license\": \"ISC\",\n  \"devDependencies\": {\n    \"@babel/core\": \"^7.0.0\",\n    \"@babel/plugin-proposal-class-properties\": \"^7.0.0\",\n    \"@babel/plugin-proposal-decorators\": \"^7.0.0\",\n    \"@babel/plugin-transform-object-assign\": \"^7.0.0\",\n    \"@babel/plugin-transform-runtime\": \"^7.0.0\",\n    \"@babel/preset-env\": \"^7.0.0\",\n    \"@babel/preset-react\": \"^7.0.0\",\n    \"@babel/preset-stage-1\": \"^7.0.0\",\n    \"@babel/preset-stage-2\": \"^7.0.0\",\n    \"babel-loader\": \"^8.0.2\",\n    \"babel-plugin-transform-decorators\": \"^6.24.1\",\n    \"react\": \"^16.5.0\",\n    \"react-dom\": \"^16.5.0\",\n    \"react-redux\": \"^5.0.7\",\n    \"react-router-dom\": \"^4.3.1\",\n    \"redux\": \"^4.0.0\",\n    \"webpack\": \"^4.17.3\",\n    \"webpack-cli\": \"^3.1.0\"\n  },\n  \"dependencies\": {\n    \"axios\": \"^0.18.0\",\n    \"dropzone\": \"^5.5.1\",\n    \"lodash\": \"^4.17.10\",\n    \"moment\": \"^2.22.2\",\n    \"prop-types\": \"^15.6.2\",\n    \"react-addons-update\": \"^15.6.2\",\n    \"react-bootstrap\": \"^0.32.4\",\n    \"react-datetime\": \"^2.15.0\",\n    \"react-dnd\": \"^5.0.0\",\n    \"react-dnd-html5-backend\": \"^5.0.1\",\n    \"react-media\": \"^1.8.0\",\n    \"react-tooltip\": \"^3.8.1\"\n  }\n}\n\nAm I maybe using @babel/plugin-proposal-decorators wrong? As it says in documentation this should fix my problem, but it still appears.","ecosystem":"npm","package_name":"babeljs","package_version":null,"solution":"I had the same problem, but I was able to get it working by running npm install --save-dev @babel/plugin-proposal-decorators and adding [\"@babel/plugin-proposal-decorators\", { \"legacy\": true }] to the plugins section in my .babelrc.\n\nThe plugins section of .babelrc, for me, now looks like this:\n\n\"plugins\": [\n  [\"@babel/plugin-proposal-decorators\", { \"legacy\": true }]\n]","confidence":0.95,"source":"stackoverflow","source_url":"https://stackoverflow.com/questions/52262084/syntax-error-support-for-the-experimental-syntax-decorators-legacy-isnt-cur","votes":123,"created_at":"2026-04-19T04:51:22.570409+00:00","updated_at":"2026-04-19T04:51:22.570409+00:00"}