admin管理员组文章数量:1323383
I am working in a brand new Angular 14 application. My node version is v14.20.0, npm is 8.17.0
I'm not sure why, but for some reason I have all of these nodejs dependencies included. I've tried deleting node_modules and npm installing again, but I still run into this issue.
I've tried a number of solutions I saw online for this issue, but I can't seem to outrun this bug.
How can I find and remove the package(s) that is requiring all of these dependencies? below is the initial error that I saw, and it occurred for a number of different packages.
BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default. This is no longer the case. Verify if you need this module and configure a polyfill for it.
If you want to include a polyfill, you need to: - add a fallback 'resolve.fallback: { "zlib": require.resolve("browserify-zlib") }' - install 'browserify-zlib' If you don't want to include a polyfill, you can use an empty module like this: resolve.fallback: { "zlib": false }
This error appeared for a number of different dependencies. I was able to resolve the errors in my terminal by installing via npm, and then adding these paths to my tscongfig.json
{
"pileOnSave": false,
"pilerOptions": {
"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"]
}
This solved the Webpack 5 errors in the terminal. However, when I went observe the application in the browser, I saw two more errors.
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)
I resolved them by adding the below code to my polyfills.ts file
import 'zone.js'; // Included with Angular CLI.
(window as any).global = window;
(window as any).process = { env: { DEBUG: undefined }, };
now I am getting this error in the chrome console
Uncaught TypeError: Cannot read properties of undefined (reading 'prototype')
at 8606 (response.js:43:45)
I think that the answer is to just not import whatever package contains all of these dependencies, but I don't know how to locate and remove it.
If anyone has any insight into this it would be greatly appreciated.
I would post screenshots, but my rep isn't high enough yet. If you need more information please ask.
Thank you
I am working in a brand new Angular 14 application. My node version is v14.20.0, npm is 8.17.0
I'm not sure why, but for some reason I have all of these nodejs dependencies included. I've tried deleting node_modules and npm installing again, but I still run into this issue.
I've tried a number of solutions I saw online for this issue, but I can't seem to outrun this bug.
How can I find and remove the package(s) that is requiring all of these dependencies? below is the initial error that I saw, and it occurred for a number of different packages.
BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default. This is no longer the case. Verify if you need this module and configure a polyfill for it.
If you want to include a polyfill, you need to: - add a fallback 'resolve.fallback: { "zlib": require.resolve("browserify-zlib") }' - install 'browserify-zlib' If you don't want to include a polyfill, you can use an empty module like this: resolve.fallback: { "zlib": false }
This error appeared for a number of different dependencies. I was able to resolve the errors in my terminal by installing via npm, and then adding these paths to my tscongfig.json
{
"pileOnSave": false,
"pilerOptions": {
"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"]
}
This solved the Webpack 5 errors in the terminal. However, when I went observe the application in the browser, I saw two more errors.
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)
I resolved them by adding the below code to my polyfills.ts file
import 'zone.js'; // Included with Angular CLI.
(window as any).global = window;
(window as any).process = { env: { DEBUG: undefined }, };
now I am getting this error in the chrome console
Uncaught TypeError: Cannot read properties of undefined (reading 'prototype')
at 8606 (response.js:43:45)
I think that the answer is to just not import whatever package contains all of these dependencies, but I don't know how to locate and remove it.
If anyone has any insight into this it would be greatly appreciated.
I would post screenshots, but my rep isn't high enough yet. If you need more information please ask.
Thank you
Share Improve this question asked Aug 17, 2022 at 2:26 Timothy KoarTimothy Koar 611 silver badge3 bronze badges 1- 1 Try checking out this answer stackoverflow./a/67808287/12291279 – csgeek Commented Aug 19, 2022 at 6:44
1 Answer
Reset to default 6I also suddenly got so many dependencies issues though I didn't change anything as such. The code was working fine before. Then I realized that I imported Router module from wrong package. Instead of importing Router
from angular-router
, I accidently imported it from express
:|
import { Router } from 'express'; // wrong import
import { Router } from '@angular/router'; // right import
本文标签:
版权声明:本文标题:javascript - Angular 14 Webpack 5 error, unnecessary nodejs modules (I think) are preventing me from serving application - Stack 内容由网友自发贡献,该文观点仅代表作者本人, 转载请联系作者并注明出处:http://www.betaflare.com/web/1742118321a2421575.html, 本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容,一经查实,本站将立刻删除。
发表评论