New Node Version Fails at yarn serve

[JNeiger]

When launching the front end using yarn serve with a node version >= 17, it will fail to start with the following error message.

joe@DESKTOP-2H0D5SC:~/go/src/github.com/RoboCup-SSL/ssl-vision-client$ yarn serve --openssl-legacy-provider
yarn run v1.22.19
$ vue-cli-service serve --openssl-legacy-provider
 INFO  Starting development server...
10% building 2/5 modules 3 active ..._modules/babel-loader/lib/index.js!/home/joe/go/src/github.com/RoboCup-SSL/ssl-vision-client/node_modules/eslint-loader/index.js??ref--13-0!/home/joe/go/src/github.com/RoboCup-SSL/ssl-vision-client/src/main.jsError: error:0308010C:digital envelope routines::unsupported
    at new Hash (node:internal/crypto/hash:71:19)
    at Object.createHash (node:crypto:133:10)
    at module.exports (/home/joe/go/src/github.com/RoboCup-SSL/ssl-vision-client/node_modules/webpack/lib/util/createHash.js:135:53)
    at NormalModule._initBuildHash (/home/joe/go/src/github.com/RoboCup-SSL/ssl-vision-client/node_modules/webpack/lib/NormalModule.js:417:16)
    at handleParseError (/home/joe/go/src/github.com/RoboCup-SSL/ssl-vision-client/node_modules/webpack/lib/NormalModule.js:471:10)
    at /home/joe/go/src/github.com/RoboCup-SSL/ssl-vision-client/node_modules/webpack/lib/NormalModule.js:503:5
    at /home/joe/go/src/github.com/RoboCup-SSL/ssl-vision-client/node_modules/webpack/lib/NormalModule.js:358:12
    at /home/joe/go/src/github.com/RoboCup-SSL/ssl-vision-client/node_modules/loader-runner/lib/LoaderRunner.js:373:3
    at iterateNormalLoaders (/home/joe/go/src/github.com/RoboCup-SSL/ssl-vision-client/node_modules/loader-runner/lib/LoaderRunner.js:214:10)
    at iterateNormalLoaders (/home/joe/go/src/github.com/RoboCup-SSL/ssl-vision-client/node_modules/loader-runner/lib/LoaderRunner.js:221:10)
    at /home/joe/go/src/github.com/RoboCup-SSL/ssl-vision-client/node_modules/loader-runner/lib/LoaderRunner.js:236:3
    at runSyncOrAsync (/home/joe/go/src/github.com/RoboCup-SSL/ssl-vision-client/node_modules/loader-runner/lib/LoaderRunner.js:130:11)
    at iterateNormalLoaders (/home/joe/go/src/github.com/RoboCup-SSL/ssl-vision-client/node_modules/loader-runner/lib/LoaderRunner.js:232:2)
    at Array.<anonymous> (/home/joe/go/src/github.com/RoboCup-SSL/ssl-vision-client/node_modules/loader-runner/lib/LoaderRunner.js:205:4)
    at Storage.finished (/home/joe/go/src/github.com/RoboCup-SSL/ssl-vision-client/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:55:16)
    at /home/joe/go/src/github.com/RoboCup-SSL/ssl-vision-client/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:91:9
node:internal/crypto/hash:71
  this[kHandle] = new _Hash(algorithm, xofLen);
                  ^

Error: error:0308010C:digital envelope routines::unsupported
    at new Hash (node:internal/crypto/hash:71:19)
    at Object.createHash (node:crypto:133:10)
    at module.exports (/home/joe/go/src/github.com/RoboCup-SSL/ssl-vision-client/node_modules/webpack/lib/util/createHash.js:135:53)
    at NormalModule._initBuildHash (/home/joe/go/src/github.com/RoboCup-SSL/ssl-vision-client/node_modules/webpack/lib/NormalModule.js:417:16)
    at handleParseError (/home/joe/go/src/github.com/RoboCup-SSL/ssl-vision-client/node_modules/webpack/lib/NormalModule.js:471:10)
    at /home/joe/go/src/github.com/RoboCup-SSL/ssl-vision-client/node_modules/webpack/lib/NormalModule.js:503:5
    at /home/joe/go/src/github.com/RoboCup-SSL/ssl-vision-client/node_modules/webpack/lib/NormalModule.js:358:12
    at /home/joe/go/src/github.com/RoboCup-SSL/ssl-vision-client/node_modules/loader-runner/lib/LoaderRunner.js:373:3
    at iterateNormalLoaders (/home/joe/go/src/github.com/RoboCup-SSL/ssl-vision-client/node_modules/loader-runner/lib/LoaderRunner.js:214:10)
    at Array.<anonymous> (/home/joe/go/src/github.com/RoboCup-SSL/ssl-vision-client/node_modules/loader-runner/lib/LoaderRunner.js:205:4)
    at Storage.finished (/home/joe/go/src/github.com/RoboCup-SSL/ssl-vision-client/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:55:16)
    at /home/joe/go/src/github.com/RoboCup-SSL/ssl-vision-client/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:91:9
    at /home/joe/go/src/github.com/RoboCup-SSL/ssl-vision-client/node_modules/graceful-fs/graceful-fs.js:115:16
    at FSReqCallback.readFileAfterClose [as oncomplete] (node:internal/fs/read_file_context:68:3) {
  opensslErrorStack: [ 'error:03000086:digital envelope routines::initialization error' ],
  library: 'digital envelope routines',
  reason: 'unsupported',
  code: 'ERR_OSSL_EVP_UNSUPPORTED'
}

Node.js v18.13.0
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

To fix this, you must prepend the command with NODE_OPTIONS=--openssl-legacy-provider (Eg: NODE_OPTIONS=--openssl-legacy-provider yarn serve).

See SO answer for more details. The underlying issue is due to a hash function no longer allowed by default in OpenSSL. I don't have enough experience in this stack to help fix it, but this should at least provide a workaround for others who hit this issue in the mean time.

[g3force]

I had a look at it and did not find a satisfying quick fix. Instead, I'll migrate the project to vue 3 and vite soon.

[g3force]

Done. You should be able to build the UI on the master branch now.