web-dev-qa-db-ja.com

Ionic Cordova 3をIonic Cordova 5に移行する方法は？

Ionicプロジェクトがあり、pgradeをIonic 5にする必要があります。プロジェクトをアップグレードするための最良の方法が必要です。

ionic-frameworkionic3ionic5
1
iOSPrince

これは2つのステップで実行できます。

Ionic 3からIonic 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. blankスターターを使用して新しいプロジェクトを生成します（ アプリの起動 を参照）

  2. Angularサービスを_src/providers_から_src/app/services_にコピーします

    • サービスは、@Injectable()デコレーターに_{ providedIn: 'root' }_を含める必要があります。詳細については、Angular provider docs を参照してください。

  3. ディレクトリ構造が_src/components_から_src/app/components_などに変更されることに注意して、アプリの他のルートレベルのアイテム（パイプ、コンポーネントなど）をコピーします。

  4. グローバルなSassスタイルを_src/app/app.scss_から_src/global.scss_にコピーします

  5. 次の項目を念頭に置いて、アプリケーションの残りの部分をページごとまたは機能ごとにコピーします。

    • エミュレートされたシャドウDOMはデフォルトでオンになっています
    • ページ/コンポーネントSassはページ/コンポーネントタグでラップされなくなり、_@Component_デコレータのAngularのstyleUrlsオプションを使用する必要があります
    • RxJSがv5からv6に更新されました（ RxJSの変更 を参照）
    • 特定のライフサイクルフックはAngularのフックに置き換える必要があります（ ライフサイクルイベント を参照）
    • マークアップの変更が必要な場合があります（利用可能な移行ツール、 マークアップの変更 を参照）

多くの場合、Ionic CLIを使用して新しいオブジェクトを生成し、コードをコピーすることも非常にうまく機能します。例：_ionic g service weather_は、Shell Weatherサービスを作成してテストします。その後、必要に応じてコードを少し変更して、古いプロジェクトからコピーできます。これにより、適切な構造が確実に守られます。これにより、単体テスト用のシェルも生成されます。

Ionic 4からIonic 5

アプリを4.xから5.xに移行するには、APIプロパティ、 CSSユーティリティ 、およびインストールされているパッケージの依存関係をいくつか更新する必要があります。

4.xから5.xへの重大な変更の完全なリストについては、Ionicコアリポジトリの 重大な変更に関する文書 を参照してください。

Angularベースのプロジェクトの場合、次のコマンドを実行するだけです。

_npm install @ionic/angular@latest @ionic/angular-toolkit@latest --save
_

詳細と手順については、 移行ガイド を確認してください。

1
Tomislav Stankovic