Setting Up an Angular Development Environment

Every Angular problem is easier with a healthy toolchain, and half of beginners' "Angular is broken" moments are really environment problems. This guide sets up a clean Angular development environment in 2026 — Node via a version manager, the Angular CLI, a first workspace, and the VS Code extensions that matter — with the version pitfalls called out before you hit them.

Setting Up an Angular Development Environment

Node.js: use a version manager, mind the minimums

Angular's CLI enforces specific Node versions — current Angular requires Node 22.12+ or 24.x (we hit this for real while building the companion repo: Node 22.14 was rejected by the CLI's stricter minor requirement, and stepping to 24.15 fixed it in one command). The lesson: don't install Node from a system installer you can't switch; use a version manager.

macOS/Linux — nvm:

curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.40.1/install.sh | bash
nvm install 24
nvm use 24
node --version   # v24.x

Windows — nvm-windows or fnm work the same way. Per-project pinning via a .nvmrc file containing 24 means nvm use in any checkout gets the right runtime — the whole team, CI included, on one version.

npm arrives with Node. corepack enable if your team uses pnpm or yarn; plain npm is fine for Angular.

The Angular CLI

npm install -g @angular/cli
ng version

The CLI is the center of the workflow — scaffolding, dev server, builds, tests, migrations. Two habits worth adopting immediately: run ng commands inside a workspace so the locally-installed CLI version takes over (global and local CLIs can differ safely), and prefer npx @angular/cli@latest new ... when creating projects if you don't want a global install at all.

Create and run a workspace

ng new my-app --style css
cd my-app
ng serve

The scaffold asks about stylesheet format and SSR; defaults are sensible. ng serve compiles, serves at http://localhost:4200, and hot-reloads on save. From the companion repo, a from-scratch scaffold on this setup builds in seconds:

Application bundle generation complete. [2.779 seconds]
Initial total | 268.13 kB | 72.36 kB (transfer)

Modern Angular defaults you get for free: standalone components (no NgModules to learn first), signals, the @if/@for control-flow syntax, and esbuild-based builds — if a tutorial starts with app.module.ts, it's from an earlier era.

VS Code: the extensions that matter

Only one is essential: Angular Language Service — template type checking, autocomplete for component members inside HTML, go-to-definition across the template/class boundary. Without it, templates are stringly-typed; with it, a typo'd property is a red squiggle. Worth adding: ESLint (pair with ng add angular-eslint), Prettier for formatting, and EditorConfig (the scaffold ships an .editorconfig).

Debugging in VS Code needs no extension: the JavaScript debugger attaches to Chrome/Edge — a launch.json with type chrome against http://localhost:4200, breakpoints land in your TypeScript via source maps.

Enable strict template checking in tsconfig.json if the scaffold hasn't ("strictTemplates": true under angularCompilerOptions) — it turns template mistakes into build errors, which is where you want them.

The commands you'll live in

ng serve                          # dev server + HMR
ng generate component products    # scaffold with tests
ng build                          # production build to dist/
ng test                           # unit tests
ng update                         # framework migrations between majors

ng update @angular/core @angular/cli is the underrated one — Angular ships automated migrations with each major, and codebases that update on schedule stay effortless while skip-three-majors codebases become projects.

Troubleshooting the classics

"The Angular CLI requires a minimum Node.js version..." — the exact error our setup produced; nvm install 24 && nvm use 24, done.
ng not found after global install — the npm global bin isn't on PATH (nvm handles this; system Node sometimes doesn't).
EACCES on global installs — never sudo npm install; that's the version manager's job.
Corporate proxy pain — npm config set proxy/https-proxy, and point the CLI's package manager accordingly.
Stale state weirdness — rm -rf node_modules .angular && npm install resolves more mysteries than anyone admits.

With the environment healthy, the actual framework is next: the components tutorial builds your first real components on this workspace, and the complete example project for the whole Angular series is in the companion repository.