javascript - Angular 14 Webpack 5-feil, unødvendige nodejs-moduler (tror jeg) hindrer meg i å serve applikasjonen

Jeg jobber i en helt ny Angular 14-applikasjon. Min node-versjon er v14.20.0, npm er 8.17.0

Jeg er ikke sikker på hvorfor, men av en eller annen grunn har jeg alle disse Node.js-avhengighetene inkludert. Jeg har prøvd å slette node_modules og kjøre npm install på nytt, men jeg støter fortsatt på dette problemet.

Jeg har prøvd en rekke løsninger jeg så på nettet for dette problemet, men jeg ser ikke ut til å klare å løpe fra denne feilen.

Hvordan kan jeg finne og fjerne pakken(e) som krever alle disse avhengighetene? Nedenfor er den opprinnelige feilen jeg så, og den oppstod for en rekke forskjellige pakker.

BRYTENDE ENDRING: webpack < 5 inkluderte tidligere polyfills for Node.js kjerne-moduler som standard. Dette er ikke lenger tilfelle. Kontroller om du trenger denne modulen og konfigurer en polyfill for den.

Hvis du vil inkludere en polyfill, må du: - legge til en fallback 'resolve.fallback: { "zlib": require.resolve("browserify-zlib") }' - installere 'browserify-zlib' Hvis du ikke vil inkludere en polyfill, kan du bruke en tom modul slik: resolve.fallback: { "zlib": false }

Denne feilen dukket opp for en rekke forskjellige avhengigheter. Jeg klarte å løse feilene i terminalen min ved å installere via npm, og deretter legge til disse stiene i tsconfig.json

{
 "compileOnSave": false,
 "compilerOptions": {
"paths": { 
  "path": [ "./node_modules/path-browserify" ],
  "stream": ["./node_modules/stream-browserify"],
  "http": ["./node_modules/stream-http"],    
  "crypto": ["./node_modules/crypto-browserify"],
  "zlib": ["./node_modules/browserify-zlib"]
}

Dette løste Webpack 5-feilene i terminalen. Men da jeg gikk for å se på applikasjonen i nettleseren, så jeg to flere feil.

capability.js:1 Uncaught ReferenceError: global is not defined
 at 2942 (capability.js:1:28)
 at __webpack_require__ (bootstrap:19:1)

util.js:109 Uncaught ReferenceError: process is not defined
 at 74 (util.js:109:1)

Jeg løste dem ved å legge til koden nedenfor i filen min polyfills.ts

import 'zone.js';  // Included with Angular CLI.

(window as any).global = window;
(window as any).process = { env: { DEBUG: undefined }, };

nå får jeg denne feilen i Chrome-konsollen

Uncaught TypeError: Cannot read properties of undefined (reading 'prototype')
 at 8606 (response.js:43:45)

Jeg tror at løsningen er å rett og slett ikke importere hvilken som helst pakke som inneholder alle disse avhengighetene, men jeg vet ikke hvordan jeg skal finne og fjerne den.

Hvis noen har noen innsikt i dette, vil det bli veldig verdsatt.

Jeg ville lagt ut skjermbilder, men omdømmet mitt er ikke høyt nok ennå. Hvis du trenger mer informasjon, vennligst spør.

Takk

Svar #1

Jeg fikk også plutselig så mange avhengighetsproblemer selv om jeg ikke hadde endret noe som helst. Koden fungerte fint før. Så innså jeg at jeg hadde importert Router-modulen fra feil pakke. I stedet for å importere Router fra angular-router, importerte jeg den ved et uhell fra express :|

import { Router } from 'express'; // wrong import
import { Router } from '@angular/router'; // right import