javascript - Angular 14 Webpack 5 error, modul nodejs yang tidak perlu (saya pikir) mencegah saya menjalankan aplikasi

Saya sedang bekerja di aplikasi Angular 14 yang baru. Versi node saya adalah v14.20.0, npm adalah 8.17.0

Saya tidak yakin mengapa, tapi entah kenapa saya memiliki semua dependensi nodejs ini. Saya sudah mencoba menghapus node_modules dan menginstal npm lagi, tetapi saya masih mengalami masalah ini.

Saya telah mencoba sejumlah solusi yang saya lihat online untuk masalah ini, tetapi sepertinya saya tidak bisa mengatasi bug ini.

Bagaimana saya bisa menemukan dan menghapus paket yang membutuhkan semua dependensi ini? Berikut adalah kesalahan awal yang saya lihat, dan itu terjadi untuk sejumlah paket yang berbeda.

PERUBAHAN PENTING: webpack < 5 sebelumnya menyertakan polyfill untuk modul inti node.js secara default. Ini tidak berlaku lagi. Periksa apakah Anda memerlukan modul ini dan konfigurasikan polyfill untuk itu.

Jika Anda ingin menyertakan polyfill, Anda perlu: - menambahkan fallback 'resolve.fallback: { "zlib": require.resolve("browserify-zlib") }' - menginstal 'browserify-zlib' Jika Anda tidak ingin menyertakan polyfill, Anda dapat menggunakan modul kosong seperti ini: resolve.fallback: { "zlib": false }

Kesalahan ini muncul untuk sejumlah dependensi yang berbeda. Saya berhasil menyelesaikan kesalahan di terminal saya dengan menginstal melalui npm, dan kemudian menambahkan jalur-jalur ini ke tsconfig.json saya

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

Ini menyelesaikan kesalahan Webpack 5 di terminal. Namun, ketika saya mengamati aplikasi di browser, saya melihat dua kesalahan lagi.

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)

Saya menyelesaikannya dengan menambahkan kode di bawah ini ke file polyfills.ts saya

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

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

sekarang saya mendapatkan kesalahan ini di konsol chrome

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

Saya pikir jawabannya adalah dengan tidak mengimpor paket apa pun yang berisi semua dependensi ini, tetapi saya tidak tahu bagaimana menemukannya dan menghapusnya.

Jika ada yang memiliki wawasan tentang ini, itu akan sangat dihargai.

Saya ingin membagikan tangkapan layar, tapi reputasi saya belum cukup tinggi. Jika Anda membutuhkan informasi lebih, silakan bertanya.

Terima kasih

Jawaban #1

Saya juga tiba-tiba mengalami begitu banyak masalah dependensi padahal saya tidak mengubah apa pun. Kode tersebut sebelumnya berjalan dengan baik. Kemudian saya menyadari bahwa saya mengimpor modul Router dari paket yang salah. Alih-alih mengimpor Router dari angular-router, saya secara tidak sengaja mengimpor dari express :|

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