我已经从angular 5迁移到Angular 7.之后我的RxJs操作有问题,比如observable和我的@ngrx / store。这是我的错误:
ERROR in node_modules/@ngrx/store/src/actions_subject.d.ts(2,10): error TS2305: Module C:/Users/AbousyllabaNdiaye/Documents/amundi/ClientAmundiFileIntegration/node_modules/rxjs/BehaviorSubject"' has no exported member 'BehaviorSubject'.
node_modules/@ngrx/store/src/reducer_manager.d.ts(2,10): error TS2305: Module '"C:/Users/AbousyllabaNdiaye/Documents/amundi/ClientAmundiFileIntegration/node_modules/rxjs/BehaviorSubject"' has no exported member 'BehaviorSubject'.
node_modules/@ngrx/store/src/reducer_manager.d.ts(3,10): error TS2305: Module '"C:/Users/AbousyllabaNdiaye/Documents/amundi/ClientAmundiFileIntegration/node_modules/rxjs/Observable"' has no exported member 'Observable'.
node_modules/@ngrx/store/src/scanned_actions_subject.d.ts(2,10): error TS2305: Module '"C:/Users/AbousyllabaNdiaye/Documents/amundi/ClientAmundiFileIntegration/node_modules/rxjs/Subject"' has no exported member 'Subject'.
node_modules/@ngrx/store/src/state.d.ts(2,10): error TS2305: Module '"C:/Users/AbousyllabaNdiaye/Documents/amundi/ClientAmundiFileIntegration/node_modules/rxjs/BehaviorSubject"' has no exported member 'BehaviorSubject'.
node_modules/@ngrx/store/src/state.d.ts(3,10): error TS2305: Module '"C:/Users/AbousyllabaNdiaye/Documents/amundi/ClientAmundiFileIntegration/node_modules/rxjs/Observable"' has no exported member 'Observable'.
node_modules/@ngrx/store/src/store.d.ts(2,10): error TS2305: Module '"C:/Users/AbousyllabaNdiaye/Documents/amundi/ClientAmundiFileIntegration/node_modules/rxjs/Observer"' has no exported member 'Observer'.
node_modules/@ngrx/store/src/store.d.ts(3,10): error TS2305: Module '"C:/Users/AbousyllabaNdiaye/Documents/amundi/ClientAmundiFileIntegration/node_modules/rxjs/Observable"' has no exported member 'Observable'.
node_modules/@ngrx/store/src/store.d.ts(4,10): error TS2305: Module '"C:/Users/AbousyllabaNdiaye/Documents/amundi/ClientAmundiFileIntegration/node_modules/rxjs/Operator"' has no exported member 'Operator'.
node_modules/rxjs/BehaviorSubject.d.ts(1,15): error TS2307: Cannot find module 'rxjs-compat/BehaviorSubject'.
node_modules/rxjs/Observable.d.ts(1,15): error TS2307: Cannot find module 'rxjs-compat/Observable'.
node_modules/rxjs/Observer.d.ts(1,15): error TS2307: Cannot find module 'rxjs-compat/Observer'.
node_modules/rxjs/Operator.d.ts(1,15): error TS2307: Cannot find module 'rxjs-compat/Operator'.
node_modules/rxjs/Subject.d.ts(1,15): error TS2307: Cannot find module 'rxjs-compat/Subject'.
src/app/habilitation/habilitation.component.ts(96,36): error TS2339: Property 'subscribe' does not exist on type 'Store<Principal>'.
src/app/sidebare/sidebare.component.ts(17,36): error TS2339: Property 'subscribe' does not exist on type 'Store<Principal>'.
你应该修复你的Rxjs导入。从v6开始使用rxjs有一些相当大的变化。
尝试使用:import { BehaviorSubject } from 'rxjs';
与其他进口相似:
import { Observable } from 'rxjs';
import { Operator } from 'rxjs';
所有这些出口现在都是从rxjs完成的。你可以打开rxjs/index.d.ts
来查看rxjs的所有输出。
由于pipe
的变化以及与JavaScript保留字的冲突,一些运算符必须重命名:
do
成为tap
catch
和finally
成为catchError
finalize
switch
成为switchAll
其他功能也被重命名:
fromPromise
成为from
throw
成为throwError
升级角度5到7时请遵循以下几点
Angular Update Guide | 5.2 -> 7.2 for Advanced Apps
更新前
1)如果从@ angular / core导入任何动画服务或工具,则应从@ angular / animations导入它们
2)用ngOutletContext
替换ngTemplateOutletContext
。
3)用CollectionChangeRecord
替换IterableChangeRecord
4)您使用Renderer的任何地方,现在使用Renderer2
5)如果使用preserveQueryParams,请使用queryParamsHandling
6)如果您使用遗留的HttpModule和Http服务,请切换到HttpClientModule和HttpClient服务。 HttpClient简化了默认的人机工程学(您不再需要映射到json),现在支持类型返回值和拦截器。阅读angular.io的更多信息
7)如果你使用@ angular / platform-browser中的DOCUMENT,你应该从@ angular / common开始导入它
8)您使用ReflectiveInjector的任何地方,现在都使用StaticInjector
9)在angularCompilerOptions键下的tsconfig.json中为preserveWhitespace选择off值,以获得此设置的好处,该设置在v6中默认设置为off。
在更新期间
1)确保您使用的是Node 8或更高版本
2)全局和本地更新Angular CLI,并通过运行以下命令将配置迁移到新的angular.json格式:
npm install -g @angular/cli
npm install @angular/cli
ng update @angular/cli
3)更新package.json中可能包含的任何脚本,以使用最新的Angular CLI命令。现在,所有CLI命令都使用两个用于标记的破折号(例如ng build --prod --source-map)与POSIX兼容。
4)将所有Angular框架包更新到v6,以及正确版本的RxJS和TypeScript。
ng update @angular/core
更新后,TypeScript和RxJS将更准确地在您的应用程序中流动类型,这可能会暴露应用程序的类型中的现有错误
5)在Angular Forms中,当您调用AbstractControl#markAsPending时,AbstractControl#statusChanges现在会发出PENDING事件。如果您正在过滤或检查来自statusChanges的事件,请确保在调用markAsPending时考虑新事件。
6)如果使用禁用区域内的AnimationEvent的totalTime,它将不再报告时间为0.要检测动画事件是否报告禁用的动画,则可以使用event.disabled属性。
7)ngModelChange现在在其控制而不是之前更新值/有效性之后发出,以更好地匹配期望。如果您依赖这些事件的顺序,则需要开始跟踪组件中的旧值。
8)将Angular Material更新为最新版本。
ng update @angular/material
这也将自动迁移已弃用的API。
9)使用ng update或普通的包管理器工具来识别和更新其他依赖项。
10)如果您将TypeScript配置为严格(如果在tsconfig.json文件中已将strict设置为true),请更新tsconfig.json以禁用strictPropertyInitialization或将属性初始化从ngOnInit移动到构造函数。您可以在TypeScript 2.7发行说明中了解有关此标志的更多信息。
11)使用rxjs-tslint自动更新规则删除已弃用的RxJS 6功能
对于大多数应用程序,这将意味着运行以下两个命令:
npm install -g rxjs-tslint
rxjs-5-to-6-migrate -p src/tsconfig.app.json
12)Angular现在使用TypeScript 3.1,阅读更多有关任何潜在破坏性变化的信息:https://www.typescriptlang.org/docs/handbook/release-notes/typescript-3-1.html
13)Angular现在增加了对Node 10的支持:https://nodejs.org/en/blog/release/v10.0.0/
14)通过在终端中运行ng update @ angular / cli @ angular / core,更新到核心框架和CLI的v7
15)通过在终端中运行ng update @ angular / material,将Angular Material更新为v7。您应该测试应用程序的大小和布局更改。
16)如果你使用截图测试,你将需要重新生成你的截图黄金文件,因为许多小的视觉调整已经落地
更新后
1)一旦你和你的所有依赖关系更新到RxJS 6
,删除rxjs-compat
。
npm uninstall rxjs-compat
2)如果使用Angular Service工作程序,请将任何versionedFiles迁移到files数组。行为是一样的。
3)停止使用matRippleSpeedFactor
和baseSpeedFactor
进行涟漪,而不是使用动画配置。
npm和rxjs-compat
如果您想让解决方案快速运行!否则按照上面的解决方案。