Erreur avec docker et de réagir, enveloppe numérique routines::non pris en charge

Je suis inscrit à un docker cours et de l'enseignant a fourni un démarreur de projet avec des vieux réagir code.

Je dockerized le projet react, voici la simple Dockerfile:

FROM node

WORKDIR /app

COPY package.json .

RUN npm i

COPY . .

EXPOSE 3000

CMD ["npm", "start"]

Ensuite, j'ai fabriqué l'image:

docker build -t goals-react .

Et a couru un récipient en attaché mode:

docker run --name goals-app --rm -p 3000:3000 goals-react

C'est la sortie que j'ai reçu:

> [email protected] start
> react-scripts start

ℹ ｢wds｣: Project is running at http://172.17.0.4/
ℹ ｢wds｣: webpack output is served from
ℹ ｢wds｣: Content not from webpack is served from /app/public
ℹ ｢wds｣: 404s will fallback to /

Starting the development server...

Error: error:0308010C:digital envelope routines::unsupported
    at new Hash (node:internal/crypto/hash:67:19)      
    at Object.createHash (node:crypto:130:10)
    at module.exports (/app/node_modules/webpack/lib/util/createHash.js:135:53)
    at NormalModule._initBuildHash (/app/node_modules/webpack/lib/NormalModule.js:417:16)
    at handleParseError (/app/node_modules/webpack/lib/NormalModule.js:471:10)
    at /app/node_modules/webpack/lib/NormalModule.js:503:5
    at /app/node_modules/webpack/lib/NormalModule.js:358:12
    at /app/node_modules/loader-runner/lib/LoaderRunner.js:373:3
    at iterateNormalLoaders (/app/node_modules/loader-runner/lib/LoaderRunner.js:214:10)
    at iterateNormalLoaders (/app/node_modules/loader-runner/lib/LoaderRunner.js:221:10)
/app/node_modules/react-scripts/scripts/start.js:19
  throw err;
  ^

Error: error:0308010C:digital envelope routines::unsupported
    at new Hash (node:internal/crypto/hash:67:19)      
    at Object.createHash (node:crypto:130:10)
    at module.exports (/app/node_modules/webpack/lib/util/createHash.js:135:53)
    at NormalModule._initBuildHash (/app/node_modules/webpack/lib/NormalModule.js:417:16)
    at /app/node_modules/webpack/lib/NormalModule.js:452:10
    at /app/node_modules/webpack/lib/NormalModule.js:323:13
    at /app/node_modules/loader-runner/lib/LoaderRunner.js:367:11
    at /app/node_modules/loader-runner/lib/LoaderRunner.js:233:18
    at context.callback (/app/node_modules/loader-runner/lib/LoaderRunner.js:111:13)
    at /app/node_modules/babel-loader/lib/index.js:59:103 {
  opensslErrorStack: [ 'error:03000086:digital envelope routines::initialization error' ],
  library: 'digital envelope routines',
  reason: 'unsupported',
  code: 'ERR_OSSL_EVP_UNSUPPORTED'
}

Node.js v17.1.0

J'ai supposé que c'était parce que le projet react était en utilisant une ancienne version de réagir, j'ai donc mis à jour le package.json fichier avec les commandes suivantes:

npx npm-check-updates -u
npm install

Puis j'ai supprimé et recréé à l'image, et puis a couru un nouveau conteneur:

docker rmi goals-react
docker build -t goals-react .
docker run --name goals-app --rm -p 3000:3000 goals-react

Mais à ma grande surprise, j'ai reçu le même message d'erreur. J'ai donc googlé digital envelope routines::unsupported et j'ai encore trouvé un autre stackoverflow discussion.

J'ai exécuté la commande suivante:

export NODE_OPTIONS=--openssl-legacy-provider

Puis j'ai reconstruit l'image et redémarré le conteneur, mais en vain. J'ai décidé de lire le message d'erreur de manière plus approfondie et il semble être un webpack erreur. Je suis allé à la webpack page github et j'ai réalisé que quelqu'un avait le même problème, ici, en revanche, la question est fermée. Ils ont également recommandé la commande ci-dessus, mais qui de toute évidence ne fonctionne pas pour moi.

Merci d'avance pour tous vos commentaires et de l'aide.

Edit:

Comme demandé par @MikiBelavista, voici le paquet.fichier json:

{
  "name": "frontend",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@testing-library/jest-dom": "^5.15.1",
    "@testing-library/react": "^12.1.2",
    "@testing-library/user-event": "^13.5.0",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "react-scripts": "4.0.3"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}