Angular を安全に実験する 既存およびプロジェクトを持つ開発者向けガイド

PHPz
リリース: 2024-07-17 13:10:19
オリジナル
1071 人が閲覧しました

既存のプロジェクトを中断せずに Angular 18 を探索する

私は最近 Angular 17 プロジェクトに取り組んでいて、Angular 18 のエキサイティングな新機能を探求したくてうずうずしていました。しかし、すでに運用されている既存のプロジェクトに影響を与えない方法でこれを実行したいと考えていました。 QA フェーズ。これには少し課題がありました:

  • グローバル Angular 17: Angular CLI バージョン 17 をグローバルにインストールしました。
  • Angular 18 の要件: Node.js バージョン 18.19 以降が Angular 18 の前提条件でした。
  • 既存のプロジェクトの保存: 既存の Angular 17 プロジェクトをそのままにしておく必要がありました。

ノード バージョン マネージャー (NVM) の利用:

これに取り組むために、Node Version Manager (NVM) を活用することにしました。 NVM を使用すると、システム上の複数の Node.js バージョンを管理できるため、異なるプロジェクトに合わせてバージョンを簡単に切り替えることができます。設定方法は次のとおりです:

  1. NVM をインストールします: NVM の公式 Web サイトの指示に従って、ここからダウンロードしてインストールできます。

  2. Node.js 18 以降をインストールします: NVM がインストールされたら、次のコマンドを使用しました

nvm install latest 

ログイン後にコピー

これにより、最新の Node.js バージョン (当時は 22.4.1) がインストールされました。

別の開発環境の作成:

次に、Angular 18 の練習プロジェクト用に別のディレクトリを作成しました。これは、環境を既存のプロジェクトから分離するのに役立ちます。

Angular 18 をローカルにインストールする:

この特定のプロジェクトに Angular 18 をインストールするには、次のコマンドを使用しました:

npm install @angular/cli@latest 
ログイン後にコピー

-g がないことに注意してください。これにより、グローバル インストールに影響を与えることなく、最新の Angular CLI バージョン (当時は 18.1.0) がプロジェクト ディレクトリ内にローカルにインストールされます。

びっくり!まだそこには至っていません:

Angular 17 (Global installation)

ng new practice-project を使用して新しいプロジェクトを作成しようとすると、デフォルトでグローバルにインストールされた Angular CLI バージョン (17) が使用されます。ここで npx の魔法が役立ちます。

Node Package Executor (npx) の紹介:

npx を使用すると、パッケージをグローバルにインストールせずに npm からパッケージを実行できます。これが、新しいプロジェクトに特定の Angular CLI バージョン (18) を使用するための鍵であることがわかりました。勝利のコマンドは次のとおりです:

npx @angular/cli@18 new my-angular-18-project
ログイン後にコピー

ng バージョンを実行してプロジェクトを検証します

Angular 18 (Local configured)

成功! Angular 18 の探索:

必要な依存関係がインストールされるのを待った後、新しい Angular 18 プロジェクト (my-angular-18-project) の準備が整いました。これにより、既存の Angular 17 プロジェクトを妨げることなく、魅力的な @let 構文を含む Angular 18 のすべての新機能を探索できるようになりました。

以上がAngular を安全に実験する 既存およびプロジェクトを持つ開発者向けガイドの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:dev.to
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート
私たちについて 免責事項 Sitemap
PHP中国語ウェブサイト:福祉オンライン PHP トレーニング,PHP 学習者の迅速な成長を支援します!