如何将 Ionic Cordova 3 迁移到 Ionic Cordova 5？

Question

我有Ionic 3项目，我必须升级到Ionic 5。请需要升级项目的最佳方式。

Answer 1

您可以分两步完成。

离子 3 到离子 4

有关从 Ionic 3 到 Ionic 4 的重大更改的完整列表，请参阅Ionic 核心存储库中的重大更改文档。

在 Ionic 4 中，包名是@ionic/angular. 卸载 Ionic 3 并使用新的软件包名称安装 Ionic 4：

npm uninstall ionic-angular
npm install @ionic/angular

将现有应用程序从 Ionic 3 迁移到 4 时的一般过程：

1. 使用blankstarter生成一个新项目（请参阅启动应用程序）

2. 将任何 Angular 服务从 复制src/providers到src/app/services

   • 服务应该包含{ providedIn: 'root' }在@Injectable() 装饰器中。有关详细信息，请参阅 Angular提供程序文档。

3. 复制应用程序的其他根级项目（管道、组件等），记住目录结构从 src/components到src/app/components等。

4. 将全局 Sass 样式复制src/app/app.scss到src/global.scss

5. 逐页或逐个功能复制应用程序的其余部分，记住以下几点：

   • 模拟 Shadow DOM 默认开启
   • 页面/组件 Sass 不应再包含在页面/组件标签中，而应使用 Angular 的装饰器styleUrls选项@Component
   • RxJS 已从 v5 更新到 v6（请参阅RxJS 更改）
   • 某些生命周期钩子应该被 Angular 的钩子替换（参见生命周期事件）
   • 可能需要更改标记（可用迁移工具，请参阅标记更改）

在很多情况下，使用 Ionic CLI 生成新对象然后复制代码也很有效。例如：ionic g service weather将创建一个shellWeather服务并进行测试。然后可以根据需要从旧项目中复制代码，并稍作修改。这有助于确保遵循正确的结构。这也会为单元测试生成 shell。

离子 4 到离子 5

将应用程序从 4.x 迁移到 5.x 需要对 API 属性、CSS 实用程序和已安装的软件包依赖项进行一些更新。

有关从 4.x 到 5.x 的重大变更的完整列表，请参阅重大变更文档Ionic 核心存储库中。

对于基于 Angular 的项目，您可以简单地运行：

npm install @ionic/angular@latest @ionic/angular-toolkit@latest --save

有关其他信息和说明，请查看迁移指南。