Angular 14 Webpack 5 错误，不必要的 Nodejs 模块（我认为）阻止我为应用程序提供服务

Question

我正在开发一个全新的 Angular 14 应用程序。我的node版本是v14.20.0，npm是8.17.0

我不知道为什么，但由于某种原因，我包含了所有这些 Nodejs 依赖项。我尝试删除node_modules并再次安装npm，但仍然遇到这个问题。

我已经尝试了一些在网上看到的针对这个问题的解决方案，但我似乎无法摆脱这个错误。

如何找到并删除需要所有这些依赖项的包？下面是我看到的最初错误，它发生在许多不同的包上。

重大更改：webpack < 5 默认情况下包含 Node.js 核心模块的 Polyfill。这已不再是这种情况。验证您是否需要此模块并为其配置一个polyfill。

如果你想包含一个polyfill，你需要： - 添加一个后备 'resolve.fallback: { "zlib": require.resolve("browserify-zlib") }' - 安装 'browserify-zlib' 如果你不这样做想要包含一个polyfill，你可以使用一个空模块，如下所示：resolve.fallback: { "zlib": false }

许多不同的依赖项都会出现此错误。我能够通过 npm 安装解决终端中的错误，然后将这些路径添加到我的 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"]
}

这解决了终端中的 Webpack 5 错误。然而，当我在浏览器中观察该应用程序时，我又看到了两个错误。

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)

我通过将以下代码添加到我的 polyfills.ts 文件中解决了这些问题

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

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

现在我在 chrome 控制台中收到此错误

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

我认为答案是不导入包含所有这些依赖项的任何包，但我不知道如何找到并删除它。

如果有人对此有任何见解，将不胜感激。

我会发布屏幕截图，但我的代表还不够高。如果您需要更多信息，请询问。

谢谢

Answer 1

我也突然遇到了很多依赖问题，尽管我没有改变任何东西。该代码之前运行良好。然后我意识到我从错误的包中导入了 Router 模块。我不小心Router从:|导入了angular-router它，而不是从 导入。express

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