I am trying to import a really old react project which has all the dependencies list.
My current package.json file:

  "devDependencies": {
    "@testing-library/jest-dom": "^5.16.5",
    "@testing-library/react": "^14.0.0",
    "@types/react": "^18.2.14",
    "@types/react-dom": "^18.2.6",
    "@vitejs/plugin-react": "^4.0.1",
    "cross-fetch": "^3.1.6",
    "dotenv": "^16.3.1",
    "jsdom": "^22.1.0",
    "sass": "^1.63.6",
    "typescript": "^5.1.3",
    "vite": "^4.3.9",
    "vite-plugin-environment": "^1.1.3",
    "vitest": "^0.32.2"
  },
  "dependencies": {
    "react": "^18.2.0",
    "react-dom": "^18.2.0"
  },

And the old project’s package.json file is:

  "devDependencies": {
    "assert": "2.0.0",
    "buffer": "6.0.3",
    "copy-webpack-plugin": "^9.0.1",
    "css-loader": "^6.2.0",
    "events": "3.3.0",
    "html-webpack-plugin": "5.3.1",
    "process": "0.11.10",
    "stream-browserify": "3.0.0",
    "style-loader": "^3.2.1",
    "svg-url-loader": "7.1.1",
    "terser-webpack-plugin": "5.1.1",
    "ts-loader": "^9.2.6",
    "typescript": "^4.5.5",
    "url-loader": "^4.1.1",
    "util": "0.12.3",
    "webpack": "5.63.0",
    "webpack-cli": "4.9.1",
    "webpack-dev-server": "^4.4.0"
  },
  "dependencies": {
    "bootstrap": "^5.1.3",
    "lit-html": "^1.4.1",
    "react": "^17.0.2",
    "react-bootstrap": "^2.1.2",
    "react-dom": "^17.0.2",
    "react-hook-form": "^7.27.1",
    "react-router-dom": "^5.2.0",
    "ts-loader": "^9.2.3",
    "typescript": "^4.3.5",
    "webpack-cli": "^4.9.2"
  }

Now the easiest way is to copy these to the current package file and do a npm install with --force or --legacy-peer-deps but for some reasons it is returning (I have verified that there are no syntax errors and it has happened to me before as well)

up to date, audited 345 packages in 1s

71 packages are looking for funding
  run `npm fund` for details

found 0 vulnerabilities

I previously did manual installs of per dependencies by removing their version and running all the words with npm install <dep words here> but that was inefficient.

I searched a lot but I didn’t find a way to

1. npm installusing the imports declared inside the js and jsx files, that may update the devdep and dep statements inside package.json without a hassle.
2. npm install using imports declared inside js and jx files, creating a package.json which might have lost.
3. Just update/create the devdependencies/package.json file automatically by looking at the imports statements (and additionally the already present node_modules folder)

I might sound stupid but I want to know if there is a way to automatically add dependencies (inside package.json)and install it by using/referring to the imports statement declared inside the js files.

Please help

I have tried to run npm installand npm updatebut that doesn’t help because of the required version declared for the project and it never adds the missing dependency files to node_modules which crashes my application returning log

Unknown property ‘-moz-osx-font-smoothing’.  Declaration dropped. main.css:9:27
Error in parsing value for ‘height’.  Declaration dropped. main.css:24:11
Expected color but found ‘"blue"’.  Error in parsing value for ‘background-color’.  Declaration dropped. main.css:32:21
Unknown property ‘-moz-osx-font-smoothing’.  Declaration dropped. main.css:38:27
Error in parsing value for ‘font-weight’.  Declaration dropped. main.css:266:16
Unknown pseudo-class or pseudo-element ‘-ms-input-placeholder’.  Ruleset ignored due to bad selector. main.css:505:23
Unknown pseudo-class or pseudo-element ‘-ms-input-placeholder’.  Ruleset ignored due to bad selector. main.css:510:23
Unknown pseudo-class or pseudo-element ‘-ms-input-placeholder’.  Ruleset ignored due to bad selector. main.css:533:25
Unknown pseudo-class or pseudo-element ‘-ms-input-placeholder’.  Ruleset ignored due to bad selector. main.css:538:25
Unknown pseudo-class or pseudo-element ‘-ms-input-placeholder’.  Ruleset ignored due to bad selector. main.css:553:31
Unknown pseudo-class or pseudo-element ‘-ms-input-placeholder’.  Ruleset ignored due to bad selector. main.css:558:31
Error in parsing value for ‘font-weight’.  Declaration dropped. main.css:926:16
Error in parsing value for ‘font-size’.  Declaration dropped.