admin管理员组

文章数量:1129455

My issue is that I've tried to create a new React project and after a lot of issues with vulnerabilities, I managed to solve some of them, one of the main instructions was adding this line:

"overrides": {
    "@svgr/webpack": "$@svgr/webpack"
  },

into my package.json file.

Once I've done that, I had to delete my node_modules folder folder and reuse npm install and now I am getting a Babel error after typing npm start.

One of your dependencies, babel-preset-react-app, is importing the
"@babel/plugin-proposal-private-property-in-object" package without
declaring it in its dependencies. This is currently working because
"@babel/plugin-proposal-private-property-in-object" is already in your
node_modules folder for unrelated reasons, but it may break at any time.

babel-preset-react-app is part of the create-react-app project, which is not maintained anymore. It is thus unlikely that this bug will
ever be fixed. Add "@babel/plugin-proposal-private-property-in-object" to
your devDependencies to work around this error. This will make this message
go away.

I tried to search for the solution over the internet and I found only one that tells me to add this plugin to my devDependencies which did not work, and I also found a solution that tells to type CI= npm run build which didn't work either.

This is what I'm encountering when typing npm list @babel/plugin-proposal-private-property-in-object:

npm ERR! code ELSPROBLEMS
npm ERR! invalid: @babel/plugin-proposal-private-property-in-object@7.21.0-placeholder-for-preset-env.2 C:\Users\Omri-PC\Desktop\KeeperApp\node_modules\@babel\plugin-proposal-private-property-in-object
[email protected] C:\Users\Omri-PC\Desktop\KeeperApp
├── @babel/plugin-proposal-private-property-in-object@7.21.0-placeholder-for-preset-env.2 invalid: "^x.x.x" from the root project
└─┬ @svgr/[email protected] overridden
  └─┬ @babel/[email protected]
    └── @babel/plugin-proposal-private-property-in-object@7.21.0-placeholder-for-preset-env.2 deduped invalid: "^x.x.x" from the root project

And that's how my package.json file looks like if it somehow helps to figure:

{
  "name": "keeper-app-part-1-starting",
  "version": "1.0.0",
  "description": "",
  "keywords": [],
  "main": "src/index.js",
  "dependencies": {
    "react": "18.2.0",
    "react-dom": "18.2.0"
  },
  "devDependencies": {
    "@svgr/webpack": "^8.0.1",
    "react-scripts": "5.0.1",
    "typescript": "5.1.3"
  },
  "overrides": {
    "@svgr/webpack": "$@svgr/webpack"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test --env=jsdom",
    "eject": "react-scripts eject"
  },
  "browserslist": [
    ">0.2%",
    "not dead",
    "not ie <= 11",
    "not op_mini all"
  ]
}

My issue is that I've tried to create a new React project and after a lot of issues with vulnerabilities, I managed to solve some of them, one of the main instructions was adding this line:

"overrides": {
    "@svgr/webpack": "$@svgr/webpack"
  },

into my package.json file.

Once I've done that, I had to delete my node_modules folder folder and reuse npm install and now I am getting a Babel error after typing npm start.

One of your dependencies, babel-preset-react-app, is importing the
"@babel/plugin-proposal-private-property-in-object" package without
declaring it in its dependencies. This is currently working because
"@babel/plugin-proposal-private-property-in-object" is already in your
node_modules folder for unrelated reasons, but it may break at any time.

babel-preset-react-app is part of the create-react-app project, which is not maintained anymore. It is thus unlikely that this bug will
ever be fixed. Add "@babel/plugin-proposal-private-property-in-object" to
your devDependencies to work around this error. This will make this message
go away.

I tried to search for the solution over the internet and I found only one that tells me to add this plugin to my devDependencies which did not work, and I also found a solution that tells to type CI= npm run build which didn't work either.

This is what I'm encountering when typing npm list @babel/plugin-proposal-private-property-in-object:

npm ERR! code ELSPROBLEMS
npm ERR! invalid: @babel/plugin-proposal-private-property-in-object@7.21.0-placeholder-for-preset-env.2 C:\Users\Omri-PC\Desktop\KeeperApp\node_modules\@babel\plugin-proposal-private-property-in-object
[email protected] C:\Users\Omri-PC\Desktop\KeeperApp
├── @babel/plugin-proposal-private-property-in-object@7.21.0-placeholder-for-preset-env.2 invalid: "^x.x.x" from the root project
└─┬ @svgr/[email protected] overridden
  └─┬ @babel/[email protected]
    └── @babel/plugin-proposal-private-property-in-object@7.21.0-placeholder-for-preset-env.2 deduped invalid: "^x.x.x" from the root project

And that's how my package.json file looks like if it somehow helps to figure:

{
  "name": "keeper-app-part-1-starting",
  "version": "1.0.0",
  "description": "",
  "keywords": [],
  "main": "src/index.js",
  "dependencies": {
    "react": "18.2.0",
    "react-dom": "18.2.0"
  },
  "devDependencies": {
    "@svgr/webpack": "^8.0.1",
    "react-scripts": "5.0.1",
    "typescript": "5.1.3"
  },
  "overrides": {
    "@svgr/webpack": "$@svgr/webpack"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test --env=jsdom",
    "eject": "react-scripts eject"
  },
  "browserslist": [
    ">0.2%",
    "not dead",
    "not ie <= 11",
    "not op_mini all"
  ]
}
Share Improve this question edited Dec 7, 2023 at 21:39 Peter Mortensen 31.6k22 gold badges109 silver badges133 bronze badges asked Jun 8, 2023 at 19:56 Omri Ben LuluOmri Ben Lulu 1,8712 gold badges4 silver badges8 bronze badges 3
  • ELSPROBLEMS mans that npm detects that the node_modules folder has an invalid layout. Could you try adding the devDependency, deleting node_modules and package-lock.json, and re-running npm install? – Nicolò Commented Jun 9, 2023 at 10:22
  • Run this command on your Project folder it will resolve the issue npm install --save-dev @babel/plugin-proposal-private-property-in-object – Sandeep Mukherjee Commented May 17, 2024 at 16:38
  • I installed both @babel/plugin-proposal... and @babel/plugin-transform... as devDependencies (as suggested by the answers) but I still see the warnings :( – Shub Commented Jul 28, 2024 at 15:58
Add a comment  | 

24 Answers 24

Reset to default 240

Running the below command solved my issue

npm install --save-dev @babel/plugin-proposal-private-property-in-object

use --save-dev to install it under devDependencies

2024 update:

The package @babel/plugin-proposal-private-property-in-object is deprecated.

  1. Use npm install --save-dev @babel/plugin-transform-private-property-in-object instead.

  2. Reference the package in your .eslintrc, e.g.

{
  "extends": ["@babel/plugin-transform-private-property-in-object", "next/core-web-vitals"]
}

Thanks to all, eventually that's what solved my problem: npm install --save-dev @babel/plugin-proposal-private-property-in-object --legacy-peer-deps

2024 Solution

TL;DR: Old answers suggest installing a package (plugin-proposal...), but it was renamed, and the most updated solution is to use the [babel/plugin-transform...] instead by updating your package.JSON file.

How To...

If you have this (@babel/plugin-proposal-...) in your package.JSON:

  "devDependencies": {
    "@babel/plugin-proposal-private-property-in-object": "^7.16.7", // PROPOSAL 
    ...
  }

Switch to this (@babel/plugin-transform-...) - Or install if you don't have any

  "devDependencies": {
    "@babel/plugin-transform-private-property-in-object": "^7.23.4", // TRANSFORM 
    ...
  }

More info can be found here at Babel/plugin-transform documentation:

I also faced this issue today. I solved by adding the required lib from here after that "npm start" and "npm run build" are fine for me. Note: used version number ^7.21.11

If you prefer yarn, this is the equivalent command:

yarn add @babel/plugin-proposal-private-property-in-object --dev

I tried to add "@babel/plugin-proposal-private-property-in-object": "^7.21.11" to devDependencies, and my CI=npm run build was successfully completed.

Here is a combination of babel packages that worked for me:

"devDependencies": {
    "@babel/core": "7.22.5",
    "@babel/eslint-parser": "7.22.5",
    "@babel/plugin-proposal-private-property-in-object": "7.21.11",
    "@babel/preset-env": "7.22.5",
}

IMPORTANT STEP: Add @babel/plugin-proposal-private-property-in-object to .babelrc plugins as well. Something like this:

"plugins": [
    ["@babel/plugin-proposal-private-property-in-object", { "loose": true }]
]

See GitHub Issue: https://github.com/babel/babel-plugin-proposal-private-property-in-object/issues/1

I was working on a hobby project earlier today and got the same warning. You just have to add the entry for "@babel/plugin-proposal-private-property-in-object" under the devDependencies object with the installed version in your project. You can find the installed version for your project in the following path:

node_modules/@babel/plugin-proposal-private-property-in-object/package.json

Once you have this version, just update the entry as mentioned above in the main package.json file of the project (the one that has the run and test commands and so on).

Here are the contents of the package.json file I modified to get rid of the warning message:

{
  "name": "clothes_shop",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@testing-library/jest-dom": "^5.16.5",
    "@testing-library/react": "^13.4.0",
    "@testing-library/user-event": "^13.5.0",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "react-scripts": "5.0.1",
    "web-vitals": "^2.1.4"
  },
  "devDependencies": {
    "@babel/plugin-proposal-private-property-in-object": "^7.21.0-placeholder-for-preset-env.2"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": [
      "react-app",
      "react-app/jest"
    ]
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}

By adding this line with the specified version, you are telling npm to install version 7.21.11 of the

@babel/plugin-proposal-private-property-in-object

package as a dependency. This can help fix any issues related to the plugin or suppress related warnings.

Node: while installing/building the app one warning came up as:

npm WARN deprecated @babel/[email protected]: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-private-property-in-object instead.

I recommend to use:

"@babel/plugin-transform-private-property-in-object": "^7.21.11" 

my build was success

After making this change, you should run npm install to ensure that the specified version of the package is installed in your project.

Please note that specifying a fixed version like this can help maintain consistency in your project but may require periodic updates to stay up-to-date with the latest package improvements and security updates.

Also just started having this issue today. Added the recommended package to the devDependencies but also having no success.

Update: Updating my global yarn install (or maybe whatever your package manager of choice is) appears to fix the issue.

Follow Up: This fix worked for my development and host server but not my production node container.

One of your dependencies, babel-preset-react-app, is importing the @babel/plugin-proposal-private-property-in-object package without declaring it in its dependencies.

This is currently working because @babel/plugin-proposal-private-property-in-object is already in your node_modules folder for unrelated reasons, but it may break at any time.

babel-preset-react-app is part of the create-react-app project, which is not maintained anymore.

It is thus unlikely that this bug will ever be fixed.

Add @babel/plugin-proposal-private-property-in-object to your devDependencies to work around this error. This will make this message go away.

this command help you to solve this problem:

npm install --save-dev @babel/plugin-proposal-private-property-in-object --legacy-peer-deps

I realized I got this error because I am using Chakra UI, and using the private statement which is not readily available for older browsers.

I installed the package per the instructions here: https://www.npmjs.com/package/@babel/plugin-proposal-private-property-in-object

npm install --save-dev @babel/plugin-proposal-private-property-in-object

Finally, I had to add a Babel file

.babelrc

{
"presets": ["@babel/preset-env", "@babel/preset-react"],
"plugins": ["@babel/plugin-proposal-private-property-in-object"]

}

I faced the same issue and using this solves my issue. @babel/[email protected]: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-private-property-in-object instead.

For me, all I needed to do was update typescript to the latest version. My project uses both typescript and javascript. This fixed it for me:

npm install typescript@latest

The latest version of typescript at the time of this writing is 5.5.4.

I simply created a ".babelrc.sjon" file on the root of my application and wrote into it:

"presets": ["@babel/preset-env", "@babel/preset-react"]

This worked for me.

yarn add --dev @babel/plugin-proposal-private-property-in-object

use --dev to install it under devDependencies

Pls, remember use engine node version >= 16.0.0

TL;DR: If you're using a monorepo you must add the dev dependency to both the React app in question and the root package.json, not just to the React app.

More fulsome answer: if you have a monorepo (I'm using NPM Workspaces but this may apply to other monorepos too), where one of your apps is the React app in question, similar to:

├── apps
│   ├── my-express-api
│   │   └── package.json
│   └── my-cra-app
│       └── package.json
├── package.json
└── package-lock.json 

You'll need to add the @babel/plugin-proposal-private-property-in-object dev dependency to both your React app and the monorepo's root package.json, similar to:

// add to app
npm i @babel/plugin-proposal-private-property-in-object --save-dev -w my-cra-app

// ... and to root
npm i @babel/plugin-proposal-private-property-in-object --save-dev

I got this message on my Visual Studio Code:

One of your dependencies, babel-preset-react-app, is importing the "@babel/plugin-proposal-private-property-in-object" package without declaring it in its dependencies. This is currently working, because "@babel/plugin-proposal-private-property-in-object" is already in your node_modules folder for unrelated reasons, but it may break at any time.

To sort this issue simply install what the warning is suggesting, I am using npm so just do:

npm i @babel/plugin-proposal-private-property-in-object -D

-D means that its only for local development.

I solved this problem simply by updating all the dependencies. Apparently, they solved this issue in latest updates. You can use npm-ckeck-updates package for this matter. Here is the process:
npm i npm-check-updates
ncu -u
npm install

That's it. Good luck.

to solve this issue just do this :

  1. delete "node modules" folder
  2. also delete package-lock.json (but don't delete package.json)
  3. then in terminal write npm i

This will delete all the node modules and will reinstall all from fresh. just be careful when deleting anything.

This solved my issue with babel

just add

"@babel/plugin-proposal-private-property-in-object": "^7.16.7"

at dependencies in package.json

I hope your warning will go.

My Code

"dependencies": {
        "@testing-library/jest-dom": "^5.17.0",
        "@testing-library/react": "^13.4.0",
        "@testing-library/user-event": "^13.5.0",
        "react": "^18.2.0",
        "react-dom": "^18.2.0",
        "react-scripts": "5.0.1",
        "web-vitals": "^2.1.4",
        "@babel/plugin-proposal-private-property-in-object": "^7.16.7"
},

I tried all of the above but nothing worked for me. It turned out that react didn't like that the parent folder for my project had a # in it. C:\C#\myreactapp It didn't like the naming of the C# folder. I changed the location to C:\MyProjects\myreactapp and the issue was resolved.

In our project we try to keep using the react-scripts package with as few changes as possible, therefore I have recently encountered this warning when running our tests. If I do as the warning suggests, run npm install --save-dev @babel/plugin-proposal-private-property-in-object , I end up with a line under my devDependencies that point to the latest version.

The warning will now be gone from the console when running tests. However, I now get a deprecation warning when installing.

My work around for this is to alias the package. I change the devDependency in package.json to the following:

"@babel/plugin-proposal-private-property-in-object": "npm:@babel/plugin-transform-private-property-in-object@^7.24.1"

Then when I run npm install the warnings are gone. Hope this helps.

I found that you also need to update the things that are using the old dep. For example in my case @babel/preset-env was using this deps, so by doing: npm install --save-dev @babel/preset-env I solved the issue

本文标签: