Docker ve react, dijital zarf yordamları::desteklenmiyor hatası

Bir docker kursuna kaydoldum ve eğitmen oldukça eski bir react koduyla bir başlangıç projesi sağladı.

React projesini dockerize ettim, işte basit Dockerfile:

FROM node

WORKDIR /app

COPY package.json .

RUN npm i

COPY . .

EXPOSE 3000

CMD ["npm", "start"]

Sonra görüntüyü oluşturdum:

docker build -t goals-react .

Ve ekli modda bir konteyner çalıştırdı:

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

Bu aldığım çıktı:

> [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

React projesinin react'in eski bir sürümünü kullandığı için olduğunu varsaydım, bu yüzden paketi yükselttim.aşağıdaki komutlarla json dosyası:

npx npm-check-updates -u
npm install

Sonra görüntüyü kaldırdım ve yeniden oluşturdum ve sonra yeni bir kapsayıcı çalıştırdım:

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

Ama sürprizime göre aynı hatayı aldım. Bu yüzden googledim digital envelope routines::unsupported ve başka bir stackoverflow tartışması buldum.

Aşağıdaki komutu çalıştırdım:

export NODE_OPTIONS=--openssl-legacy-provider

Sonra görüntüyü yeniden oluşturdum ve kabı yeniden başlattım, ancak boşuna. Hata mesajını daha ayrıntılı olarak okumaya karar verdim ve bir web paketi hatası gibi görünüyor. Webpack github sayfasına gittim ve burada başka birinin de aynı sorunu yaşadığını fark ettim, ancak sorun kapandı. Yukarıdaki komutu da önerdiler, ancak bu açıkça benim için işe yaramıyor.

Herhangi bir geri bildirim ve yardım için şimdiden teşekkür ederiz.

Düzenlemek:

@MikiBelavista tarafından talep edildiği gibi, işte paket.json dosyası:

{
  "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"
    ]
  }
}