Unspecified `node` and `npm` versions
Opened this issue · 5 comments
npm install for any of the front-end projects no longer works on current LTS versions of node and/or npm.
The book doesn't specify which version you used.
Your package.json files don't specify any engine versions either.
What do I need to get the code running?
Here's the error output from ng serve:
Compiling @angular/cdk/scrolling : es2015 as esm2015
⠸ Generating browser application bundles (phase: building)...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 BulkUpdateDecorator.hashFactory (/home/mindplay/workspace/Reactive-Patterns-with-RxJS-for-Angular/Chapter04/recipes-book-front/node_modules/webpack/lib/util/createHash.js:145:18)
at BulkUpdateDecorator.update (/home/mindplay/workspace/Reactive-Patterns-with-RxJS-for-Angular/Chapter04/recipes-book-front/node_modules/webpack/lib/util/createHash.js:46:50)
at OriginalSource.updateHash (/home/mindplay/workspace/Reactive-Patterns-with-RxJS-for-Angular/Chapter04/recipes-book-front/node_modules/webpack/node_modules/webpack-sources/lib/OriginalSource.js:104:8)
at NormalModule._initBuildHash (/home/mindplay/workspace/Reactive-Patterns-with-RxJS-for-Angular/Chapter04/recipes-book-front/node_modules/webpack/lib/NormalModule.js:868:17)
at handleParseResult (/home/mindplay/workspace/Reactive-Patterns-with-RxJS-for-Angular/Chapter04/recipes-book-front/node_modules/webpack/lib/NormalModule.js:934:10)
at /home/mindplay/workspace/Reactive-Patterns-with-RxJS-for-Angular/Chapter04/recipes-book-front/node_modules/webpack/lib/NormalModule.js:1026:4
at processResult (/home/mindplay/workspace/Reactive-Patterns-with-RxJS-for-Angular/Chapter04/recipes-book-front/node_modules/webpack/lib/NormalModule.js:743:11)
at /home/mindplay/workspace/Reactive-Patterns-with-RxJS-for-Angular/Chapter04/recipes-book-front/node_modules/webpack/lib/NormalModule.js:807:5 {
opensslErrorStack: [ 'error:03000086:digital envelope routines::initialization error' ],
library: 'digital envelope routines',
reason: 'unsupported',
code: 'ERR_OSSL_EVP_UNSUPPORTED'
}
Node.js v18.14.2
Installing it didn't immediately work either:
$ npm install
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: recipes-book@0.0.0
npm ERR! Found: rxjs@7.5.4
npm ERR! node_modules/rxjs
npm ERR! rxjs@"7.5.4" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer rxjs@"^6.5.3" from @angular/core@12.1.5
npm ERR! node_modules/@angular/core
npm ERR! @angular/core@"~12.1.1" from the root project
npm ERR! peer @angular/core@"12.1.5" from @angular/animations@12.1.5
npm ERR! node_modules/@angular/animations
npm ERR! @angular/animations@"~12.1.1" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR!
npm ERR! For a full report see:
npm ERR! /home/mindplay/.npm/_logs/2023-02-28T14_19_12_842Z-eresolve-report.txt
npm ERR! A complete log of this run can be found in:
npm ERR! /home/mindplay/.npm/_logs/2023-02-28T14_19_12_842Z-debug-0.log
I was able to install using npm install --legacy-peer-deps as it suggests, but with a flood of warnings:
$ npm install --legacy-peer-deps
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE package: '@angular-devkit/build-angular@12.1.4',
npm WARN EBADENGINE required: {
npm WARN EBADENGINE node: '^12.14.1 || >=14.0.0',
npm WARN EBADENGINE npm: '^6.11.0 || ^7.5.6',
npm WARN EBADENGINE yarn: '>= 1.13.0'
npm WARN EBADENGINE },
npm WARN EBADENGINE current: { node: 'v18.14.2', npm: '9.5.1' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE package: '@angular/cli@12.1.4',
npm WARN EBADENGINE required: {
npm WARN EBADENGINE node: '^12.14.1 || >=14.0.0',
npm WARN EBADENGINE npm: '^6.11.0 || ^7.5.6',
npm WARN EBADENGINE yarn: '>= 1.13.0'
npm WARN EBADENGINE },
npm WARN EBADENGINE current: { node: 'v18.14.2', npm: '9.5.1' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE package: '@angular-devkit/architect@0.1201.4',
npm WARN EBADENGINE required: {
npm WARN EBADENGINE node: '^12.14.1 || >=14.0.0',
npm WARN EBADENGINE npm: '^6.11.0 || ^7.5.6',
npm WARN EBADENGINE yarn: '>= 1.13.0'
npm WARN EBADENGINE },
npm WARN EBADENGINE current: { node: 'v18.14.2', npm: '9.5.1' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE package: '@angular-devkit/build-optimizer@0.1201.4',
npm WARN EBADENGINE required: {
npm WARN EBADENGINE node: '^12.14.1 || >=14.0.0',
npm WARN EBADENGINE npm: '^6.11.0 || ^7.5.6',
npm WARN EBADENGINE yarn: '>= 1.13.0'
npm WARN EBADENGINE },
npm WARN EBADENGINE current: { node: 'v18.14.2', npm: '9.5.1' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE package: '@angular-devkit/build-webpack@0.1201.4',
npm WARN EBADENGINE required: {
npm WARN EBADENGINE node: '^12.14.1 || >=14.0.0',
npm WARN EBADENGINE npm: '^6.11.0 || ^7.5.6',
npm WARN EBADENGINE yarn: '>= 1.13.0'
npm WARN EBADENGINE },
npm WARN EBADENGINE current: { node: 'v18.14.2', npm: '9.5.1' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE package: '@angular-devkit/core@12.1.4',
npm WARN EBADENGINE required: {
npm WARN EBADENGINE node: '^12.14.1 || >=14.0.0',
npm WARN EBADENGINE npm: '^6.11.0 || ^7.5.6',
npm WARN EBADENGINE yarn: '>= 1.13.0'
npm WARN EBADENGINE },
npm WARN EBADENGINE current: { node: 'v18.14.2', npm: '9.5.1' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE package: '@ngtools/webpack@12.1.4',
npm WARN EBADENGINE required: {
npm WARN EBADENGINE node: '^12.14.1 || >=14.0.0',
npm WARN EBADENGINE npm: '^6.11.0 || ^7.5.6',
npm WARN EBADENGINE yarn: '>= 1.13.0'
npm WARN EBADENGINE },
npm WARN EBADENGINE current: { node: 'v18.14.2', npm: '9.5.1' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE package: '@angular-devkit/schematics@12.1.4',
npm WARN EBADENGINE required: {
npm WARN EBADENGINE node: '^12.14.1 || >=14.0.0',
npm WARN EBADENGINE npm: '^6.11.0 || ^7.5.6',
npm WARN EBADENGINE yarn: '>= 1.13.0'
npm WARN EBADENGINE },
npm WARN EBADENGINE current: { node: 'v18.14.2', npm: '9.5.1' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE package: '@schematics/angular@12.1.4',
npm WARN EBADENGINE required: {
npm WARN EBADENGINE node: '^12.14.1 || >=14.0.0',
npm WARN EBADENGINE npm: '^6.11.0 || ^7.5.6',
npm WARN EBADENGINE yarn: '>= 1.13.0'
npm WARN EBADENGINE },
npm WARN EBADENGINE current: { node: 'v18.14.2', npm: '9.5.1' }
npm WARN EBADENGINE }
npm WARN deprecated @npmcli/move-file@1.1.2: This functionality has been moved to @npmcli/fs
npm WARN deprecated har-validator@5.1.5: this library is no longer supported
npm WARN deprecated urix@0.1.0: Please see https://github.com/lydell/urix#deprecated
npm WARN deprecated source-map-url@0.4.1: See https://github.com/lydell/source-map-url#deprecated
npm WARN deprecated resolve-url@0.2.1: https://github.com/lydell/resolve-url#deprecated
npm WARN deprecated uuid@3.4.0: Please upgrade to version 7 or higher. Older versions may use Math.random() in certain circumstances, which is known to be problematic. See https://v8.dev/blog/math-random for details.
npm WARN deprecated uuid@3.4.0: Please upgrade to version 7 or higher. Older versions may use Math.random() in certain circumstances, which is known to be problematic. See https://v8.dev/blog/math-random for details.
npm WARN deprecated querystring@0.2.0: The querystring API is considered Legacy. new code should use the URLSearchParams API instead.
npm WARN deprecated request@2.88.2: request has been deprecated, see https://github.com/request/request/issues/3142
npm WARN deprecated stable@0.1.8: Modern JS already guarantees Array#sort() is a stable sort, so this library is deprecated. See the compatibility table on MDN: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort#browser_compatibility
npm WARN deprecated flatten@1.0.3: flatten is deprecated in favor of utility frameworks such as lodash.
npm WARN deprecated source-map-resolve@0.6.0: See https://github.com/lydell/source-map-resolve#deprecated
npm WARN deprecated sourcemap-codec@1.4.8: Please use @jridgewell/sourcemap-codec instead
npm WARN deprecated source-map-resolve@0.5.3: See https://github.com/lydell/source-map-resolve#deprecated
npm WARN deprecated source-map-resolve@0.5.3: See https://github.com/lydell/source-map-resolve#deprecated
npm WARN deprecated chokidar@2.1.8: Chokidar 2 does not receive security updates since 2019. Upgrade to chokidar 3 with 15x fewer dependencies
npm WARN deprecated core-js@3.15.1: core-js@<3.23.3 is no longer maintained and not recommended for usage due to the number of issues. Because of the V8 engine whims, feature detection in old core-js versions could cause a slowdown up to 100x even if nothing is polyfilled. Some versions have web compatibility issues. Please, upgrade your dependencies to the actual version of core-js.
added 1347 packages, and audited 1348 packages in 53s
99 packages are looking for funding
run `npm fund` for details
11 vulnerabilities (1 low, 1 moderate, 8 high, 1 critical)
To address all issues possible (including breaking changes), run:
npm audit fix --force
Some issues need review, and may require choosing
a different dependency.
Run `npm audit` for details.
I realize this is a pretty normal experience with any Node project that's been sitting on a shelf for 2 years (or even 6 months) and I'm fine with running older versions of Angular and other dependencies - I have nvm and I'm happy to use outdated tools while learning, but you need to tell me what to install.
I don't want to spend the first couple of days fighting to upgrade all this outdated stuff.
I'm here to learn Angular and RxJS.
Otherwise I'm considering a refund. 😕
I merged package.json from project that works for me with package.json from the Book's project.
My conf:
Angular CLI: 15.1.4
Node: 18.14.2
Package Manager: npm 9.4.1
package.json:
{
"name": "recipes-book",
"version": "0.0.0",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"watch": "ng build --watch --configuration development",
"test": "ng test"
},
"private": true,
"dependencies": {
"@angular/animations": "~13.1.0",
"@angular/cdk": "^13.1.0",
"@angular/common": "~13.1.0",
"@angular/compiler": "~13.1.0",
"@angular/core": "~13.1.0",
"@angular/forms": "~13.1.0",
"@angular/platform-browser": "~13.1.0",
"@angular/platform-browser-dynamic": "~13.1.0",
"@angular/router": "~13.1.0",
"bootstrap": "4.6",
"primeflex": "^3.1.3",
"primeng": "^13.1.0",
"primeicons": "^6.0.1",
"quill": "^1.3.7",
"rxjs": "~7.5.4",
"tslib": "^2.3.0",
"zone.js": "~0.11.4"
},
"devDependencies": {
"@angular-devkit/build-angular": "^13.3.10",
"@angular/cli": "^15.2.1",
"@angular/compiler-cli": "~13.1.0",
"@types/jasmine": "~3.10.0",
"@types/node": "^12.11.1",
"jasmine-core": "~3.10.0",
"karma": "~6.3.0",
"karma-chrome-launcher": "~3.1.0",
"karma-coverage": "~2.1.0",
"karma-jasmine": "~4.0.0",
"karma-jasmine-html-reporter": "~1.7.0",
"typescript": "~4.5.2"
}
}
@everjava nice, I can confirm this works on node 18.14.2. Thanks!
Is font-awesome a required dependency?
For the record, I removed font-awesome and switched back to primeicons, which is what the book used.
I've created a PR #6 so others can get this running.
Thanks for the help! 🙏
I realized later that font-awesome shouldn't be there and I changed it to "primeicons": "^6.0.1" and I forgot to update here :)
I ran into the same issue and solved it by changing the start script in package.json to:
"start": "export NODE_OPTIONS=--openssl-legacy-provider; ng serve --proxy-config proxy.config.json"