如何将AngularJS 1.8.x迁移至Angular CLI 11.2.3版本？

一、渐进式迁移（最稳妥的低成本路径） #

• 保留现有AngularJS应用，用Angular CLI 11.2.3创建新项目，将两者整合到同一代码仓库
• 引入@angular/upgrade库实现双向兼容：
  • 在Angular项目中注册并启动AngularJS模块，直接复用现有组件、服务，无需一次性重写
  • 逐步将AngularJS组件重写为Angular组件，替换旧代码
• 核心代码示例：

import { UpgradeModule } from '@angular/upgrade/static';
@NgModule({
  imports: [BrowserModule, UpgradeModule],
})
export class AppModule {
  constructor(private upgrade: UpgradeModule) {}
  ngDoBootstrap() {
    this.upgrade.bootstrap(document.body, ['yourAngularJSAppModuleName']);
  }
}

二、工具辅助减少手动工作量 #

• 安装指定版本Angular CLI：npm install @angular/cli@11.2.3 -g
• 新项目初始化后，运行ng update @angular/core@11 @angular/cli@11自动对齐依赖版本、更新配置文件
• 用本地代码转换工具（如angularjs-to-angular）批量处理模板语法：将ng-click转(click)、ng-model转[(ngModel)]，减少重复修改

三、分模块逐步替换 #

• 优先替换独立业务组件（如列表、表单），再处理共享服务、路由等核心模块
• 路由过渡：用Angular的RouterModule逐步接管路由，通过UrlHandlingStrategy实现Angular与AngularJS路由共存，避免一次性重构路由体系
• 状态管理：将AngularJS的$scope、$rootScope状态逐步迁移为Angular服务+BehaviorSubject，或适配@ngrx/store（11.2.3兼容版本）

四、边替换边验证 #

• 每完成一个模块替换，立即运行单元测试和E2E测试，用Angular CLI的ng test、ng e2e命令复用原有测试用例并适配新语法
• 保留AngularJS环境的测试入口，确保新旧模块交互正常

内容的提问来源于stack exchange，提问作者Bernadette