IDEA で Angular を開発する方法の簡単な分析

この記事では、IDEA を使用して Angular を開発する方法を説明し、JetBrains IDEA でプロジェクトを作成および実行する方法を簡単に紹介します。

前回の記事では、Angular開発を行うために準備する必要がある環境について説明しましたが、環境を構築した後は、テキストツールを直接使用することはできません。 IDE を選択する必要がありますが、優れた IDE を使用すると、半分の労力で 2 倍の結果をもたらす開発が可能になります。 JetBrains IDEA を選択したのは、主に私の仕事にいくつかのエディターがあるためで、IDEA は Angular 開発をサポートする優れた IDE です。

新しいプロジェクト

File => New => Project => JavaScript => Angular CLI

次のステップを選択したら、そこでプロジェクトを構成できます。最初からこのステップまで私に従っていると、IDEA が Node インタープリターと Angular CLI の両方を自動的に構成していることがわかります。プロジェクト名を設定するだけで済みます。 [関連チュートリアルの推奨事項: "angular チュートリアル"]

[完了] をクリックした後は、ビルドが完了するのを待ちます。コンソールに次のメッセージが出力されます。次の内容は、「ビルドが成功しました」という意味です

The file will have its original line endings in your working directory
    Successfully initialized git.
Done

IDEA

1 でプロジェクトを実行します。npm スクリプトを表示します

プロジェクトのルート ディレクトリで pachage.json ファイルを見つけ、右クリックして [Show npm Script] を選択すると、新しいウィンドウが表示されます

# #このウィンドウには、一般的に使用されるコマンドがいくつかあります。start コマンドは ngserve コマンドと同等です。start をダブルクリックすると、プロジェクトのコンパイルと開始が開始されます。起動が完了すると、コンソールに次の内容が出力されます。情報

** Angular Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200/ **

√ Compiled successfully.

現時点では、http://localhost:4200 /

npm のコマンドは実際には package.json で定義されており、コマンドをカスタマイズすることもできます。

package.json の scripts ノードに

"node version": "node -v"

を追加し、npm インターフェイスを更新すると、新しい

node version コマンドが追加されたことがわかります。 -クリックは次のとおりです: ノード -v コマンド。

#2. IDEA-RUNIDEA の上部のコントロール バーには、プロジェクトを直接実行するオプションがあります

RUN または DEBUG によってプロジェクトを直接実行することを選択できます。これは実際には、

ng server

VCS からプロジェクトをプルする## を実行するのと同じです。 #

VCS => Get From Version Controll => 输入地址

プログラミング関連の知識について詳しくは、
プログラミング教育

をご覧ください。 ！

以上がIDEA で Angular を開発する方法の簡単な分析の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。