btholt/complete-intro-to-react-v5

Duplicate plugin/preset detected.

justanotherkevin opened this issue · 6 comments

Error:

/complete-intro-to-react-v5/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": "/Users/kevinhu/Documents/personal/complete-intro-to-react-v5/node_modules/@babel/plugin-proposal-class-properties/lib/index.js",
    "dirname": "/Users/kevinhu/Documents/personal/complete-intro-to-react-v5",
    "ownPass": false,
    "file": {
      "request": "@babel/plugin-proposal-class-properties",
      "resolved": "/Users/kevinhu/Documents/personal/complete-intro-to-react-v5/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": "/Users/kevinhu/Documents/personal/complete-intro-to-react-v5",
    "ownPass": false
  }
]

The problem seems to be coming from the new version of babel, which has a conflict with other babel plugins.
I got the error to go away by commenting out the plugins in the .babelrc file

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

Yes, I have encountered the same problem. This problem is coming from different node version. The proper solution is

  1. uninstall this plugin with
npm uninstall @babel/plugin-proposal-class-properties
  1. then disable it with commenting
{
  "presets": ["@babel/preset-react", "@babel/preset-env"],
  // "plugins": ["@babel/plugin-proposal-class-properties"]
}
  1. clear the cache
npm run clear-build-cache

and then you are ready to run parcel again

LxzzR commented

I'm also running into this issue.

Thanks, @Keromudo for posting your solution! Unfortunately, the solution above isn't working for me. I'm running into the following build error:

/Users/juno/Documents/fem/adopt-me/src/App.js: Cannot find module '@babel/preset-react, @babel/preset-env' from '/Users/juno/Documents/fem/adopt-me'

Interestingly, I get the same error regardless of whether the plugin is disabled in .bablerc. I've tried uninstalling all the dependencies and re-installing them, but this hasn't helped either.

I'm going to follow along the rest of the with class components, but if anyone knows of something to try, let me know! I'm curious about resolving this.

Commenting the plugin breaks the code, doesn't it? @Keromudo

@lizzSoup you may want to make sure you have these lines in your package.json:

"@babel/preset-env": "^7.12.7",    
"@babel/preset-react": "^7.12.7",

Yes, I have encountered the same problem. This problem is coming from different node version. The proper solution is

  1. uninstall this plugin with
npm uninstall @babel/plugin-proposal-class-properties
  1. then disable it with commenting
{
  "presets": ["@babel/preset-react", "@babel/preset-env"],
  // "plugins": ["@babel/plugin-proposal-class-properties"]
}
  1. clear the cache
npm run clear-build-cache

and then you are ready to run parcel again

Now clearing cache in npm is no possible

For some reason the cache command didn't work for me, So instead I used npm cache clean --force