升级Angular版本

历程

如果运行 ng build –prod,会遇到行为改变的问题。
→也许是因为你使用的 Angular CLI 版本过旧?
→尝试升级版本并进行测试(v1.7.4→6.2.1)。

结论

无法解决。

最优化, 它做了什么事情!※问题已解决→prod构建节约事件名称
开发构建和AOT都没有问题,
但是只有在–prod时,似乎会进行某种优化,导致无法捕获navigationEnd事件。

虽然如此,由于更新工作对我来说是一个学习的机会,因此我做了些笔记。

操作步驟

按照顺序执行命令

npm uninstall -g @angular/cli
npm cache verify
npm install -g @angular/cli@latest
npm install @angular/cli@latest
ng update @angular/cli

→.angular-cli.json演变为angular.json

ng update @angular/core
ng update @angular/material
npm install -g rxjs-tslint
rxjs-5-to-6-migrate -p src/tsconfig.app.json

秋天的错误收获节

可能有一些人仅仅执行命令而已就结束了。
主要是因为在rxjs方面有很多错误,所以我记下了修剪的方法。

错误:找不到模块 ‘typescript’。

https://github.com/clausreinke/typescript-tools/issues/59
貌似要取消TypeScript了?所以,我会直接安装。

npm install -g typescript

错误 TS2305: 模块 ‘”/node_modules/@angular/core/core”‘ 没有导出 ‘transition’ 成员。

https://stackoverflow.com/questions/50184274/update-angular-5-to-angular-6-error的答案中提到,似乎动画相关的模块已经移动到了angular/animations,需要修改import语句。


import {
    Component, OnInit, Input, Output, OnChanges, EventEmitter,
    trigger, state, style, animate, transition
} from '@angular/core';

请以中文本地化地改写以下内容,只需要提供一个版本:

↓↓↓


import {
  Component, OnInit, Input, Output, OnChanges, EventEmitter
} from '@angular/core';
import {
  trigger, state, style, animate, transition
} from '@angular/animations';

类型’typeof Observable’上不存在属性’of’【重复】。

这个链接里说的好像是在 typeof Observable 的类型上没有属性 “property” 的问题。而且它似乎是关于 rxjs 的规范有一些变动了。


import { Observable } from 'rxjs/Observable';
...
return Observable.of(...);

请用中文将以下内容改述,只需一种选项:
↓↓↓

请使用中文将以下内容重新表达,只需一种选项:
↓↓↓


import { Observable, of } from 'rxjs';
return of(...);

在类型’Observable’上不存在属性’map’。

这个问题的链接是:https://github.com/angular/angular/issues/15548。
我原以为它和”of”一样,结果发现有些不一样!


import { Subscription } from 'rxjs/Subscription';
...
this.http
  .get('/getApi', {})
  .map(...)

请将以下内容用中文重新表达,只需其中一种选项:

请将以下内容用中文重新表达,只需其中一种选项:

import { Subscription } from 'rxjs';
import { map } from 'rxjs/operators';
...
this.http
  .pipe(
      .get('/getApi', {})
      .map(...)
   )

最后

我为了减少rxjs的导入范围而写了’rxjs/***’,但rxjs-5-to-6-migrate却把它还原了。
不过仅需执行命令就能帮我修改是非常感激的。

广告
将在 10 秒后关闭
bannerAds