Organize "dependencies" and "devDependencies"

After deleting `.node_modules` and `yarn.lock`, I encountered this issue: react-bootstrap/react-router-bootstrap#314

The issue was resolved by following the instructions in https://stackoverflow.com/questions/71831601/ts2786-component-cannot-be-used-as-a-jsx-component to add "resolutions" to the `package.json` file.

Author: markborkum

package.json

@@ -3,68 +3,25 @@
   "version": "0.1.0",
   "private": true,
   "dependencies": {
-    "@babel/core": "^7.16.0",
-    "@babel/plugin-syntax-flow": "^7.22.5",
-    "@babel/plugin-transform-react-jsx": "^7.22.5",
     "@mdx-js/loader": "^2.3.0",
     "@mdx-js/react": "^2.3.0",
-    "@pmmmwh/react-refresh-webpack-plugin": "^0.5.3",
     "@popperjs/core": "^2.11.8",
-    "@svgr/webpack": "^5.5.0",
-    "@testing-library/dom": "^9.3.1",
-    "@testing-library/jest-dom": "^5.16.5",
-    "@testing-library/react": "^14.0.0",
-    "@testing-library/user-event": "^14.4.3",
-    "@types/image-blob-reduce": "^4.1.1",
-    "@types/jest": "^27.4.0",
-    "@types/lodash": "^4.14.191",
-    "@types/node": "^17.0.10",
-    "@types/pouchdb": "^6.4.0",
-    "@types/pouchdb-find": "^7.3.3",
-    "@types/pouchdb-upsert": "^2.2.6",
-    "@types/react": "^18.2.0",
-    "@types/react-bootstrap": "^0.32.32",
-    "@types/react-dom": "^18.2.0",
-    "babel-jest": "^27.4.2",
-    "babel-loader": "^8.2.3",
-    "babel-plugin-named-asset-import": "^0.3.8",
-    "babel-preset-react-app": "^10.0.1",
     "bfj": "^7.0.2",
     "bootstrap": "^5.3.0",
     "browser-image-compression": "^2.0.2",
     "browserslist": "^4.18.1",
     "camelcase": "^6.2.1",
-    "case-sensitive-paths-webpack-plugin": "^2.4.0",
-    "css-loader": "^6.5.1",
-    "css-minimizer-webpack-plugin": "^3.2.0",
     "dotenv": "^10.0.0",
     "dotenv-expand": "^5.1.0",
-    "eslint": "^8.45.0",
-    "eslint-config-prettier": "^8.8.0",
-    "eslint-config-react-app": "^7.0.1",
-    "eslint-config-standard": "^17.1.0",
-    "eslint-plugin-typescript": "^0.14.0",
-    "eslint-webpack-plugin": "^3.1.1",
     "exifr": "^7.1.3",
-    "file-loader": "^6.2.0",
     "fs-extra": "^10.0.0",
     "heic-jpg-exif": "^1.0.0",
     "heic2any": "^0.0.4",
-    "html-webpack-plugin": "^5.5.0",
     "identity-obj-proxy": "^3.0.0",
-    "jest": "^27.4.3",
-    "jest-resolve": "^27.4.2",
-    "jest-watch-typeahead": "^1.0.0",
     "jsx": "^0.9.89",
     "lodash": "^4.17.21",
     "markdown-to-jsx": "^7.2.0",
-    "mini-css-extract-plugin": "^2.4.5",
     "pdfjs-dist": "3.11.174",
-    "postcss": "^8.4.4",
-    "postcss-flexbugs-fixes": "^5.0.2",
-    "postcss-loader": "^6.2.1",
-    "postcss-normalize": "^10.0.1",
-    "postcss-preset-env": "^7.0.1",
     "pouchdb": "^8.0.1",
     "pouchdb-find": "^9.0.0",
     "pouchdb-upsert": "^2.2.0",
@@ -79,37 +36,15 @@
     "react-refresh": "^0.11.0",
     "react-router-bootstrap": "^0.26.2",
     "react-router-dom": "^6.12.0",
-    "react-scripts": "^5.0.1",
     "react-simple-code-editor": "^0.13.1",
     "remark": "^14.0.2",
     "remark-gfm": "^3.0.1",
     "resolve": "^1.20.0",
     "resolve-url-loader": "^4.0.0",
     "sass-loader": "^12.3.0",
     "semver": "^7.3.5",
-    "source-map-loader": "^3.0.0",
-    "style-loader": "^3.3.1",
     "tailwindcss": "^3.0.2",
-    "terser-webpack-plugin": "^5.2.5",
-    "typescript": "*",
-    "web-vitals": "^2.1.4",
-    "webpack": "^5.64.4",
-    "webpack-dev-server": "^4.6.0",
-    "webpack-license-plugin": "^4.2.2",
-    "webpack-manifest-plugin": "^4.0.2",
-    "workbox-background-sync": "^6.4.2",
-    "workbox-broadcast-update": "^6.4.2",
-    "workbox-cacheable-response": "^6.4.2",
-    "workbox-core": "^6.4.2",
-    "workbox-expiration": "^6.4.2",
-    "workbox-google-analytics": "^6.4.2",
-    "workbox-navigation-preload": "^6.4.2",
-    "workbox-precaching": "^6.4.2",
-    "workbox-range-requests": "^6.4.2",
-    "workbox-routing": "^6.4.2",
-    "workbox-strategies": "^6.4.2",
-    "workbox-streams": "^6.4.2",
-    "workbox-webpack-plugin": "^6.4.1"
+    "web-vitals": "^2.1.4"
   },
   "scripts": {
     "start": "node scripts/start.js",
@@ -138,11 +73,41 @@
     ]
   },
   "devDependencies": {
+    "@babel/core": "^7.16.0",
     "@babel/eslint-parser": "^7.22.9",
     "@babel/plugin-proposal-private-property-in-object": "^7.21.11",
+    "@babel/plugin-syntax-flow": "^7.22.5",
+    "@babel/plugin-transform-react-jsx": "^7.22.5",
+    "@pmmmwh/react-refresh-webpack-plugin": "^0.5.3",
+    "@svgr/webpack": "^5.5.0",
+    "@testing-library/dom": "^9.3.1",
+    "@testing-library/jest-dom": "^5.16.5",
+    "@testing-library/react": "^14.0.0",
+    "@testing-library/user-event": "^14.4.3",
+    "@types/image-blob-reduce": "^4.1.1",
+    "@types/jest": "^27.4.0",
+    "@types/lodash": "^4.14.191",
+    "@types/node": "^17.0.10",
+    "@types/pouchdb": "^6.4.0",
+    "@types/pouchdb-find": "^7.3.3",
+    "@types/pouchdb-upsert": "^2.2.6",
+    "@types/react": "^18.2.0",
+    "@types/react-bootstrap": "^0.32.32",
+    "@types/react-dom": "^18.2.0",
     "@types/react-router-bootstrap": "^0.26.0",
     "@typescript-eslint/eslint-plugin": "^5.50.0",
     "@typescript-eslint/parser": "^5.0.0",
+    "babel-jest": "^27.4.2",
+    "babel-loader": "^8.2.3",
+    "babel-plugin-named-asset-import": "^0.3.8",
+    "babel-preset-react-app": "^10.0.1",
+    "case-sensitive-paths-webpack-plugin": "^2.4.0",
+    "css-loader": "^6.5.1",
+    "css-minimizer-webpack-plugin": "^3.2.0",
+    "eslint": "^8.45.0",
+    "eslint-config-prettier": "^8.8.0",
+    "eslint-config-react-app": "^7.0.1",
+    "eslint-config-standard": "^17.1.0",
     "eslint-config-standard-with-typescript": "^36.1.0",
     "eslint-plugin-import": "^2.25.2",
     "eslint-plugin-mdx": "^3.1.5",
@@ -151,8 +116,43 @@
     "eslint-plugin-promise": "^6.0.0",
     "eslint-plugin-react": "^7.33.0",
     "eslint-plugin-react-hooks": "^5.1.0",
+    "eslint-plugin-typescript": "^0.14.0",
+    "eslint-webpack-plugin": "^3.1.1",
+    "file-loader": "^6.2.0",
+    "html-webpack-plugin": "^5.5.0",
+    "jest": "^27.4.3",
+    "jest-resolve": "^27.4.2",
+    "jest-watch-typeahead": "^1.0.0",
+    "mini-css-extract-plugin": "^2.4.5",
+    "postcss": "^8.4.4",
+    "postcss-flexbugs-fixes": "^5.0.2",
+    "postcss-loader": "^6.2.1",
+    "postcss-normalize": "^10.0.1",
+    "postcss-preset-env": "^7.0.1",
     "prettier": "^3.0.0",
-    "react-dev-utils": "^12.0.1"
+    "react-dev-utils": "^12.0.1",
+    "react-scripts": "^5.0.1",
+    "source-map-loader": "^3.0.0",
+    "style-loader": "^3.3.1",
+    "terser-webpack-plugin": "^5.2.5",
+    "typescript": "*",
+    "webpack": "^5.64.4",
+    "webpack-dev-server": "^4.6.0",
+    "webpack-license-plugin": "^4.2.2",
+    "webpack-manifest-plugin": "^4.0.2",
+    "workbox-background-sync": "^6.4.2",
+    "workbox-broadcast-update": "^6.4.2",
+    "workbox-cacheable-response": "^6.4.2",
+    "workbox-core": "^6.4.2",
+    "workbox-expiration": "^6.4.2",
+    "workbox-google-analytics": "^6.4.2",
+    "workbox-navigation-preload": "^6.4.2",
+    "workbox-precaching": "^6.4.2",
+    "workbox-range-requests": "^6.4.2",
+    "workbox-routing": "^6.4.2",
+    "workbox-strategies": "^6.4.2",
+    "workbox-streams": "^6.4.2",
+    "workbox-webpack-plugin": "^6.4.1"
   },
   "jest": {
     "roots": [
@@ -211,5 +211,9 @@
     "presets": [
       "react-app"
     ]
+  },
+  "resolutions": {
+    "@types/react": "^18.2.0",
+    "@types/react-dom": "^18.2.0"
   }
 }