Angular版本能否逐个组件升级？从v11到v13的可行性探讨

Angular跨小版本（v11到v13）支持逐步、逐个组件的升级策略，你提到的两种思路都完全可行，具体细节如下：

方案一：将v11组件封装为可导入的库 #

• 先搭建独立的Angular v11库项目，把待保留的v11组件迁移进去，确保ng-package.json配置正确，输出符合Angular包规范的产物。
• 在新建的Angular v13主应用中，通过本地npm link或发布私有包的方式安装这个v11库。Angular的版本兼容机制允许v13应用适配v11库（只要组件未使用v13已移除的API）。
• 逐步替换：每次挑选一个组件在v13应用中重写，测试验证后移除对v11库中对应组件的依赖。
• 关键注意：提前排查v11组件是否用到v13已废弃/移除的API（如旧视图引擎API、过时RxJS操作符），提前做兼容修改；库的依赖需锁定v11版本，避免与主应用的v13依赖冲突。

方案二：将v11组件转为Web Components #

• 使用Angular v11的@angular/elements包，通过createCustomElement API将v11组件编译为标准Web Components（自定义元素）。
• 编译后生成独立的JS bundle，直接在v13应用中通过<script>标签引入或作为模块导入即可使用，完全脱离Angular版本依赖。
• 这种方式的优势是组件可在任何现代框架中复用，无需担心版本兼容问题，但需处理好组件的输入输出、依赖注入（如将Angular服务转为全局可用形式），确保样式隔离和事件传递正常。

实用建议 #

• 优先选方案一，它更贴合Angular生态，后续维护和迁移更顺畅；Web Components适合完全独立、不依赖Angular内部服务的组件场景。
• 每次仅替换一个组件，完成后做全量测试，避免批量替换引入大量问题。
• 若想降低跨版本API差异冲击，也可先将v11应用整体升级到v12，再逐步升级到v13，但这不是逐个组件升级的必要步骤。

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