Angularフレームワークのv6.0.0リリースにあわせ、Angular CLIもv1.7系からv6.0へメジャーアップデートをおこなう予定です。 この記事ではAngular CLI v1.7系で作成した開発環境からv6.0系の開発環境へマイグレーションする方法を解説します。
この記事は安定版リリース前のRCバージョンを使用しています。
前提
次のような開発環境を想定しています。
- グローバルにAngular CLI v1.7系がインストールされている状態
ng newが可能な状態
- Angular CLI v1.7系に依存した状態のプロジェクトが存在する状態
- package.jsonの
@angular/cliがv1.7系、かつ.angular-cli.jsonファイルが存在する状態
- package.jsonの
移行ステップ
1. プロジェクトローカルのAngular CLIのバージョンを更新する
グローバルではなく、プロジェクトローカルのAngular CLIをv6.0系に更新します。 yarnであれば次のコマンドで更新します。
yarn add --dev @angular/cli@^6.0.0-rc.2
diffはこのようになります。
この時点ではプロジェクトローカルのngコマンドがアップデートされただけで、プロジェクトのマイグレーションは完了していません。
次のステップで、ng buildなどのコマンドが使用可能な状態にプロジェクトをマイグレーションします。
2. 各種設定ファイルをマイグレーションする
Angular CLI v1.7からv6.0へのアップデートのうち、最大の変更は.angular-cli.jsonファイルからangular.jsonファイルへの移行です。
これまでAngular CLIの各種設定を記述していた.angular-cli.jsonファイルは、名前だけでなく内部のJSON構造も互換性のない新しいangular.jsonに変わります。
とはいえ今までの設定をすべて書き直す必要はなく、Angular CLI v6には古い形式の.angular-cli.jsonからangular.jsonベースのプロジェクトに自動でマイグレーションしてくれる機能があります。
Angular CLI v1.7.3のプロジェクトをマイグレーションするには、次のようにコマンドを実行します。
ng update @angular/cli --migrate-only --from=1.7.3
diffはこのようになります。
このコマンドを一度実行すれば、以降はAngular CLI v6による開発をおこなえるようになります。
注意
- RC.2時点では、
ng update後のパッケージインストールがnpmになります。- グローバルの
packageManager設定はマイグレーションされないため。
- グローバルの
