How do I resolve a TypeScript dependency conflict during Firebase deployment in my Create-React-App project?

I'm deploying my first React webpage project, which is built purely in JavaScript. I haven't intentionally used TypeScript, yet when running Firebase's deployment command (which executes npm ci && npm run build), an error occurs due to a TypeScript dependency conflict.

I developed the front end using my own knowledge and assistance from ChatGPT. Version control is managed with Git. The project builds fine locally with the command below:

BASHCopied
npm build serve -s build

However, during Firebase deployment, npm ci throws an error because Firebase uses the following commands:

BASHCopied
npm ci & npm run build

The error message points out a conflict between the installed TypeScript version (5.7.3) and the version required by react‑scripts@5.0.1 (which needs ^3.2.1 || ^4). Below is the error log for reference:

SHELLCopied
npm ci        
npm error code ERESOLVE
npm error ERESOLVE could not resolve
npm error
npm error While resolving: react-scripts@5.0.1
npm error Found: typescript@5.7.3
npm error node_modules/typescript
npm error   peer typescript@">= 2.7" from fork-ts-checker-webpack-plugin@6.5.3
npm error   node_modules/fork-ts-checker-webpack-plugin
npm error     fork-ts-checker-webpack-plugin@"^6.5.0" from react-dev-utils@12.0.1
npm error     node_modules/react-dev-utils
npm error       react-dev-utils@"^12.0.1" from react-scripts@5.0.1
npm error       node_modules/react-scripts
npm error         react-scripts@"5.0.1" from the root project
npm error   peerOptional typescript@"^5" from i18next@24.2.1
npm error   node_modules/i18next
npm error     i18next@"^24.2.1" from the root project
npm error     peer i18next@">= 23.2.3" from react-i18next@15.4.0
npm error     node_modules/react-i18next
npm error       react-i18next@"^15.4.0" from the root project
npm error   1 more (tsutils)
npm error
npm error Could not resolve dependency:
npm error peerOptional typescript@"^3.2.1 || ^4" from react-scripts@5.0.1
npm error node_modules/react-scripts
npm error   react-scripts@"5.0.1" from the root project
npm error
npm error Conflicting peer dependency: typescript@4.9.5
npm error node_modules/typescript
npm error   peerOptional typescript@"^3.2.1 || ^4" from react-scripts@5.0.1
npm error   node_modules/react-scripts
npm error     react-scripts@"5.0.1" from the root project
npm error
npm error Fix the upstream dependency conflict, or retry
npm error this command with --force or --legacy-peer-deps
npm error to accept an incorrect (and potentially broken) dependency resolution.
npm error
npm error
npm error For a full report see:
npm error C:\Users\user\AppData\Local\npm-cache\_logs\2025-01-28T21_20_08_713Z-eresolve-report.txt
npm error A complete log of this run can be found in: C:\Users\user\AppData\Local\npm-cache\_logs\2025-01-28T21_20_08_713Z-debug-0.log

I suspect the issue arises from conflicting dependency versions. For additional context, here is my package.json snippet:

JSONCopied
{
  "name": "casagrande-rental",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@react-spring/web": "^9.7.5",
    "@testing-library/jest-dom": "^6.6.3",
    "@testing-library/react": "^16.2.0",
    "@testing-library/user-event": "^14.6.1",
    "date-fns": "^4.1.0",
    "emailjs-com": "^3.2.0",
    "framer-motion": "^12.0.3",
    "i18next": "^24.2.1",
    "i18next-browser-languagedetector": "^8.0.2",
    "leaflet": "^1.9.4",
    "react": "^18.3.1",
    "react-burger-menu": "^3.1.0",
    "react-datepicker": "^7.6.0",
    "react-dom": "^18.3.1",
    "react-i18next": "^15.4.0",
    "react-icons": "^5.4.0",
    "react-leaflet": "^4.2.1",
    "react-navigation": "^5.0.0",
    "react-responsive-carousel": "^3.2.23",
    "react-router-dom": "^7.1.3",
    "react-scripts": "5.0.1",
    "react-spring": "^9.7.5",
    "react-switch": "^7.1.0",
    "react-use-measure": "^2.1.1",
    "styled-components": "^6.1.14",
    "sweetalert2": "^11.15.10",
    "web-vitals": "^4.2.4"
  },
  "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"
    ]
  }
}

Any guidance on how to resolve this dependency conflict (e.g., using flags like --legacy-peer-deps, downgrading TypeScript, or adjusting dependencies) would be greatly appreciated.