How to solve ReferenceError: primordials is not defined at fs.js:47:5? previous solutions not working for me

Question

I am new with react and I want to run json-server and when I run npm run server. I got this error

 fs.js:47        
} = primordials;
    ^

ReferenceError: primordials is not defined
    at fs.js:47:5
    at req_ (D:\Mysite-react\mysite\node_modules\natives\index.js:143:24)
    at Object.req [as require] (D:\Mysite-react\mysite\node_modules\natives\index.js:55:10)
    at Object.<anonymous> (D:\Mysite-react\mysite\node_modules\configstore\node_modules\graceful-fs\fs.js:1:37)
    at Module._compile (node:internal/modules/cjs/loader:1105:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1159:10)
    at Module.load (node:internal/modules/cjs/loader:981:32)
    at Function.Module._load (node:internal/modules/cjs/loader:822:12)
    at Module.require (node:internal/modules/cjs/loader:1005:19)
    at require (node:internal/modules/cjs/helpers:102:18)

I tried to solve using the previous suggestions shown for other applications, but none are working. I created an npm-shrinkwrap.json file with the following contents: { "dependencies": { "graceful-fs": { "version": "4.2.2" } } } and delete the node_modules folder, then Run npm install and I install Gulp 4. my node version is v16.15.0 . I even install npm install natives@1.1.6 but it did n't solve my problem. my package.json file is

        {
  "name": "mysite",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@fancyapps/ui": "^4.0.27",
    "@testing-library/jest-dom": "^5.16.4",
    "@testing-library/react": "^13.2.0",
    "@testing-library/user-event": "^13.5.0",
    "babel-preset-es2015": "^6.24.1",
    "bootstrap": "^5.1.3",
    "font-awesome": "^4.7.0",
    "formik": "^2.2.9",
    "gulp-v4": "^4.0.0-alpha.5",
    "json-server": "^0.4.2",
    "mixitup": "^3.3.1",
    "react": "^18.1.0",
    "react-animated-cursor": "^2.4.0",
    "react-bootstrap": "^2.4.0",
    "react-dom": "^18.1.0",
    "react-owl-carousel": "^2.3.3",
    "react-progressbar.js": "^0.1.2",
    "react-router-bootstrap": "^0.26.1",
    "react-router-dom": "^6.3.0",
    "react-scripts": "^2.1.3",
    "react-transition-group": "^1.2.1",
    "typed.js": "^2.0.12",
    "web-vitals": "^2.1.4",
    "yup": "^0.32.11"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject",
    "server": "json-server --watch mysite.json --port 8000",
    "type": "module",
    "dev": "nodemon ./bin/www"
  },
  "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"
    ]
  },
  "devDependencies": {
    "@babel/plugin-proposal-class-properties": "^7.17.12",
    "@babel/plugin-syntax-jsx": "^7.17.12",
    "@babel/preset-react": "^7.17.12",
    "nodemon": "^2.0.16"
  }
}

after I installed npm i gulp-v4 --force , when I run gulp -v I have the following error

gulp : The term 'gulp' is not recognized as the name of a cmdlet, function, script file, or operable program. Check the 
spelling of the name, or if a path was included, verify that the path is correct and try again.
At line:1 char:1
+ gulp -v
+ ~~~~
    + CategoryInfo          : ObjectNotFound: (gulp:String) [], CommandNotFoundException
    + FullyQualifiedErrorId : CommandNotFoundException