Angular Fix, Crash & Optimization Guide

Angular is a TypeScript-based platform and framework for building single-page web applications, maintained by Google. It provides routing, dependency injection, forms, and a CLI-driven build pipeline (esbuild/Webpack + Vite-based dev server in recent versions).

Install / First Setup

Install the CLI globally and scaffold an app:

npm install -g @angular/cli
ng new my-app
cd my-app
ng serve

The dev server defaults to http://localhost:4200. A specific Node.js version is required (see Version Notes) — manage it with nvm.

Common Issues & Fixes

Node.js version not supported

Cause: Angular requires a specific Node major/minor range per release; an unsupported version aborts ng commands. Fix: Check the version requirement for your Angular release and switch via nvm use <version> (e.g. Node 18.19+ or 20+ depending on the Angular version).

"Port 4200 is already in use"

Cause: Another ng serve or app holds the default port. Fix: ng serve --port 4201, or stop the conflicting process.

"This command requires to be run in an Angular project"

Cause: Running ng outside the project root that contains angular.json. Fix: cd into the folder with angular.json before running CLI commands.

NG8001 / NG8002 template errors

Cause: Using a component/pipe/directive that isn't declared or imported in the current scope. Fix: For standalone components, add it to the imports array; for NgModule-based apps, declare/add it to the module's imports/declarations.

Build runs out of memory

Cause: Large app exceeds the default Node heap during ng build. Fix: Raise the heap: node --max-old-space-size=4096 node_modules/@angular/cli/bin/ng build (or set NODE_OPTIONS=--max-old-space-size=4096).

Performance & Optimization

• Low-End (4–8 GB RAM): Use ng serve with a capped heap (NODE_OPTIONS=--max-old-space-size=2048). Build occasionally rather than watching continuously; close other heavy apps.
• Mid (16 GB): Rely on the default AOT compiler and Ivy. Use ng build --configuration production for the optimized bundle (minification, tree-shaking). Lazy-load feature modules via loadChildren.
• Workstation (32 GB+): Increase heap for monorepos (--max-old-space-size=8192), use the Angular CLI's build cache, and split the app into lazy routes. Profile with the DevTools performance panel and the Angular DevTools extension.

Reduce bundle size with lazy routes, providedIn: 'root' tree-shakable services, and by importing only the RxJS operators you use.

Version & Compatibility Notes

• Each Angular major requires a defined Node.js range (recent versions need Node 18.19+/20+). Running outside that range triggers errors — consult the Angular update guide for your exact version.
• Standalone components are the modern default; the older NgModule style is still supported.
• The build system moved to esbuild/Application builder in recent majors; the legacy browser builder is being retired. For exact version/Node pairings, consult official release notes.

FAQ

Q: Which Node.js version does Angular need? A: It depends on the Angular major. Recent versions require Node 18.19+ or 20+; check the update guide for your specific release.

Q: How do I fix NG8001 "is not a known element"? A: Import/declare the component or module in the using component's imports (standalone) or declarations/imports (NgModule).

Q: How do I change the dev server port? A: Run ng serve --port 4201, or set port in angular.json under the serve options.

Q: Why does my build run out of memory? A: The app exceeded Node's default heap. Raise it with NODE_OPTIONS=--max-old-space-size=4096 before ng build.

Q: Standalone components vs NgModule — which should I use? A: New projects should use standalone components (the default). NgModules remain supported for existing apps.

Q: How do I reduce production bundle size? A: Lazy-load routes with loadChildren, use tree-shakable providedIn: 'root' services, and import only needed RxJS operators.

Related Guides

• React Fix & Optimization Guide
• Vue Fix & Optimization Guide
• Build Time Calculator

Accuracy Note

Commands and paths reflect common, real-world setups as of 2026-08. Always verify against your installed version and OS. When in doubt, consult the official Angular documentation.