如何将复杂项目从 Angular 1.5 迁移到 2？

Posted 2023-05-08

【中文标题】如何将复杂项目从 Angular 1.5 迁移到 2？

【英文标题】：How to migrate a complex project from Angular 1.5 to 2?

【发布时间】：2017-05-22 23:28:33

【问题描述】：

我有一个包含实时数据的生产站点。

该站点基于 jHipster (angular 1.5 + java)。 该网站是基于州的。 Websocket 用于异步通信。

现在，我想将网站从 angular v1.5 迁移到 v2。在阅读官方角度迁移指南时，似乎我必须重写很多代码。迁移的最佳方法是什么？

从头开始用 Angular 2 编写所有内容。

或

按照官方 Angular 文档中的升级指南（使用升级模块）

【问题讨论】：

从头开始重新编写。这总是会产生更好的代码库，即使它是在与第一次相同的环境中重写的，你也会从错误中吸取教训，所以第二个版本更好。

只有你可以决定...尝试两种方法

Angular 2 与 Angular 1VERY 不同。我很惊讶它甚至有升级指南

首先构建一个示例 ang2 应用程序来体验一下......然后在 ang2 中从头开始构建您的旧应用程序，这将比转换快几英里。

【参考方案1】：

视情况而定。

无论如何，你必须重写很多代码。这是肯定的。而且没有简单的方法。

我将与您分享两个想法（方法），然后简单地从下往上重写所有内容：

使用ngForward 方法。

在ngForward 方法中，我们实际上并没有升级现有的 Angular 1.x 应用程序——我们正在创建一个环境，使这些 1.x 应用程序的行为类似于 Angular 2 应用程序。换句话说，我们可以逐步重写 Angular 1.x 应用程序，使其像 Angular 2 应用程序一样工作。然后，我们可以在现有应用的基础上进一步为这个 1.x 应用增加新的 Angular 2 功能。

在this blog post 中了解更多信息。

使用ngUpgrade 方法。

通过使用ngForward 方法，我们可以在现有的 Angular 1.x 应用程序之上以 Angular 2.0 的方式编写代码。然而，这种方法可能会让一些人感到不舒服，因为担心它的可维护性和与未来 Angular 版本的向后兼容性可能是一个问题。从长远来看，ngForward 方法肯定会给庞大的 Angular 1.x 应用程序带来问题。使用ngUpgrade 方法在很大程度上解决了这个问题。 ngUpgrade 方法具有全面的文档，可从 official Angular website 获得。

您需要根据您的特定用例、项目目标等做出决定。

致谢：我是从 this tutorial 那里了解到的。

【参考方案2】：

还有第三种方法：在 Angular 2 中创建并行代码库，并通过 url 导航将其与旧的 Angular 1x 代码链接。在这里，除了添加新的导航 URL 之外，您无需修复或更改以前代码库的任何 LOC。这将节省您的时间。您的新代码将具有纯 Angular 2，不会在页面上同时混合 1.5 和 2x。唯一的挑战是在请求之间共享用户状态和数据，因为您不能再使用共享服务或工厂，但这是可行的。

我的类似迁移历史最近发表在this blog post。