I am doing a react course on front-end masters,and we had to modify the babel config to allow state instantiations like :state = {index: 0} in class ponents, however upon running the mand:
npm install -D babel-eslint @babel/core @babel/preset-env @babel/plugin-proposal-class-properties @babel/preset-react
,and creating a .babelrc file in root-directory and modifying it as such:
{ "presets": ["@babel/preset-react", "@babel/preset-env"], "plugins": ["@babel/plugin-proposal-class-properties"] }.
I get the following error:

/home/rahat/Documents/react_adopt_me/src/App.js: Duplicate plugin/preset detected.
    If you'd like to use two separate instances of a plugin,
    they need separate names, e.g.
    
      plugins: [
        ['some-plugin', {}],
        ['some-plugin', {}, 'some unique name'],
      ]
    
    Duplicates detected are:
    [
      {
        "alias": "/home/rahat/Documents/react_adopt_me/src/node_modules/@babel/plugin-proposal-class-properties/lib/index.js",
        "dirname": "/home/rahat/Documents/react_adopt_me/src",
        "ownPass": false,
        "file": {
          "request": "@babel/plugin-proposal-class-properties",
          "resolved": "/home/rahat/Documents/react_adopt_me/src/node_modules/@babel/plugin-proposal-class-properties/lib/index.js"
        }
      },
      {
        "alias": "base$2",
        "options": {
          "loose": "#__internal__@babel/preset-env__prefer-false-but-true-is-ok-if-it-prevents-an-error"
        },
        "dirname": "/home/rahat/Documents/react_adopt_me/src",
        "ownPass": false
      }
    ]

I am doing a react course on front-end masters,and we had to modify the babel config to allow state instantiations like :state = {index: 0} in class ponents, however upon running the mand:
npm install -D babel-eslint @babel/core @babel/preset-env @babel/plugin-proposal-class-properties @babel/preset-react
,and creating a .babelrc file in root-directory and modifying it as such:
{ "presets": ["@babel/preset-react", "@babel/preset-env"], "plugins": ["@babel/plugin-proposal-class-properties"] }.
I get the following error:

/home/rahat/Documents/react_adopt_me/src/App.js: Duplicate plugin/preset detected.
    If you'd like to use two separate instances of a plugin,
    they need separate names, e.g.
    
      plugins: [
        ['some-plugin', {}],
        ['some-plugin', {}, 'some unique name'],
      ]
    
    Duplicates detected are:
    [
      {
        "alias": "/home/rahat/Documents/react_adopt_me/src/node_modules/@babel/plugin-proposal-class-properties/lib/index.js",
        "dirname": "/home/rahat/Documents/react_adopt_me/src",
        "ownPass": false,
        "file": {
          "request": "@babel/plugin-proposal-class-properties",
          "resolved": "/home/rahat/Documents/react_adopt_me/src/node_modules/@babel/plugin-proposal-class-properties/lib/index.js"
        }
      },
      {
        "alias": "base$2",
        "options": {
          "loose": "#__internal__@babel/preset-env__prefer-false-but-true-is-ok-if-it-prevents-an-error"
        },
        "dirname": "/home/rahat/Documents/react_adopt_me/src",
        "ownPass": false
      }
    ]

• javascript
• json
• reactjs
• babeljs

1 Answer 1

I believe this may be a node version issue.

If you want a quick fix then uninstall the plugin-proposal-class-properties via:

npm uninstall @babel/plugin-proposal-class-properties

then disable/delete the plugin in .babelrc:

{
    "presets": ["@babel/preset-react", "@babel/preset-env"]
    //"plugins": ["@babel/plugin-proposal-class-properties"]
}

clear the cache:

npm run clear-build-cache

Then run the server again.