angular-cli

@angular/cli

版本： Angular 21 (2025) 标签： CLI、生成器、构建、脚手架

参考： CLI 参考 • 生成器 • 构建器

API 变更

本节介绍近期特定版本的 API 变更。

• 新增：控制流迁移 — 使用 ng g @angular/core:control-flow 迁移到 @if/@for 来源

• 新增：Signal 输入迁移 — 使用 ng g @angular/core:signal-input-migration 迁移到 Signal 输入 来源

• 新增：路由惰性加载迁移 — 用于独立路由

• 新增：命名工作区 — 在单个 angular.json 中包含多个应用

• 新增：默认使用 esbuild — 使用 esbuild/Vite 加快构建速度

最佳实践

• 使用生成器搭建脚手架

# Generate component
ng g c components/my-component

# Generate service
ng g s services/my-service

# Generate guard
ng g g guards/auth

# Generate interceptor
ng g interceptor timing

# Generate library
ng g library my-lib

# Generate with standalone
ng g c my-component --standalone

• 使用 schematics 进行迁移

# Migrate to control flow
ng g @angular/core:control-flow

# Migrate to signal inputs
ng g @angular/core:signal-input-migration

# Migrate to lazy loading routes
ng g @angular/core:route-lazy-loading

• 使用 ng add 添加软件包

# Add Angular Material
ng add @angular/material

# Add SSR
ng add @angular/ssr

# Add PWA
ng add @angular/pwa

• 配置工作区默认值

{
  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
  "version": 1,
  "newProjectRoot": "projects",
  "projects": {
    "my-app": {
      "schematics": {
        "@schematics/angular:component": {
          "style": "scss",
          "standalone": true
        }
      }
    }
  }
}

• 使用 ng run 运行构建器

# Run custom builder
ng run my-app:build

# Run SSR
ng run my-app:serve-ssr

# Run prerender
ng run my-app:prerender

• 使用 ng config 配置设置

# Set default style
ng config defaults.style=scss

# Enable analytics
ng analytics enable

• 使用 ng update 进行迁移

# Update packages
ng update

# Update specific package
ng update @angular/core

• 使用带选项的 ng build

# Production build
ng build --configuration=production

# Dev build with stats
ng build --stats-json

• 默认使用独立模式

# New project with standalone
ng new my-app --standalone

• 优先使用函数式而非基于类的方式

# Generate functional guard
ng g g guards/auth --functional

# Generate functional interceptor
ng g interceptor my-interceptor --functional