是否值得从Angular2迁移到Angular4？

您好SO社区和Angularians!

因此,我正在Angular 2中开发一个巨大的平台.我意识到Angular 2的许多外部库和依赖项正在迁移到新的Angular 4.很明显,给了我许多错误.

我可以分叉这些库并使用分叉版本并订阅主库开发,或者我可以升级到Angular 4我的项目.

要回答的问题是为了确定我是否值得迁移:

与Angular 2.4的兼容性

我发现了一些改进以确保与遗留的兼容性,如下所示:https://github.com/angular/angular/commit/e99d721

改变app范围

我是否必须通过我的整个应用程序并开始修复？

我的意思是,主要功能是否以这种方式重新设计,我将不得不审查其中的许多功能？

或者,是否有许多构建/核心不兼容性,这将使我几天占用修复编译错误/警告而不是开发？

我不是要求有人为我做研究,我问人们可能已经完成了这个过程,或者只是熟悉两个版本,以便给我一些经验提示,澄清等.

目前,我在这里做研究:

https://github.com/angular/angular/blob/master/CHANGELOG.md

http://angularjs.blogspot.it/2017/03/angular-400-now-available.html

https://learninglaravel.net/angular-4-new-features-and-improvements

UPDATE

我刚刚迁移到Angular 4.@PierreDuc在他的回答中提供的链接是一个非常好的工具,可以在迁移过程中获得合适的指导.

我建议:

阅读新功能并使用Angular 4更新自己.这非常有用:https://angularjs.blogspot.it/2017/03/angular-400-now-available.html

遵循Angular的指南并修改您的项目:https://angular-update-guide.firebaseapp.com/

我还建议您提交当前项目,在dev存储库中创建一个新分支,然后继续在该分支中进行迁移.

一个问题,我遇到:
Input,Output并ContentChild会从错误的道路进口.

我的情况:

import { Component, OnInit, OnDestro } from '@angular/core';
import { Input, ContentChild } from "@angular/core/src/metadata/directives";

解:

import { Component, OnInit, OnDestroy, Input, ContentChild } from '@angular/core';

PierreDuc.. 25

如果您查看更改日志,则需要注意以下几点:

在更新之前

确保您不使用扩展OnInit,或对任何生命周期事件使用扩展.而是使用implements .

停止使用DefaultIterableDiffer,KeyValueDiffers#factories或IterableDiffers#factories

停止使用深度导入,这些符号现在标记为?并且不是我们的公共API的一部分.

停止使用,Renderer.invokeElementMethod因为此方法已被删除.目前没有替代品.

在更新期间

将所有依赖项更新到版本4和最新的打字稿.

如果您使用的是Linux/Mac,则可以使用: npm install @angular/{animations,common,compiler,compiler-cli,core,forms,http,platform-browser,platform-browser-dynamic,platform-server,router}@4.0.0 typescript@latest --save

如果你在你的应用程序中使用动画,你应该导入 BrowserAnimationsModule从@angular/platform-browser/animations您的应用程序NgModule.

替换RootRenderer为RendererFactory2.

替换Renderer为Renderer2.

更新后

将您的template代码重命名为ng-template.

替换OpaqueTokens为InjectionTokens.

如果你调用DifferFactory.create(...)删除ChangeDetectorRef 参数.

替换ngOutletContext为ngTemplateOutletContext.

替换CollectionChangeRecord为IterableChangeRecord

资源

如果您查看更改日志,则需要注意以下几点:

在更新之前

确保您不使用扩展OnInit,或对任何生命周期事件使用扩展.而是使用implements .

停止使用DefaultIterableDiffer,KeyValueDiffers#factories或IterableDiffers#factories

停止使用深度导入,这些符号现在标记为?并且不是我们的公共API的一部分.

停止使用,Renderer.invokeElementMethod因为此方法已被删除.目前没有替代品.

在更新期间

将所有依赖项更新到版本4和最新的打字稿.

如果您使用的是Linux/Mac,则可以使用: npm install @angular/{animations,common,compiler,compiler-cli,core,forms,http,platform-browser,platform-browser-dynamic,platform-server,router}@4.0.0 typescript@latest --save

如果你在你的应用程序中使用动画,你应该导入 BrowserAnimationsModule从@angular/platform-browser/animations您的应用程序NgModule.

替换RootRenderer为RendererFactory2.

替换Renderer为Renderer2.

更新后

将您的template代码重命名为ng-template.

替换OpaqueTokens为InjectionTokens.

如果你调用DifferFactory.create(...)删除ChangeDetectorRef 参数.

替换ngOutletContext为ngTemplateOutletContext.

替换CollectionChangeRecord为IterableChangeRecord

资源