Angular開発コマンド

概要

Angular開発時に使用するコマンドのまとめです。

ng new [プロジェクト名]

任意のフォルダで以下コマンドを実行するとプロジェクト名のフォルダが作成され、そのフォルダ内にAngularプロジェクトの最低限のモジュール等が格納される。標準でないモジュールは、「ng add xxx」で追加する。

ng add [モジュール名]

追加したいモジュールの公式サイトに追加方法が記載されているので詳細のコマンドは、モジュールの公式サイトを参照する。

表示に関わるものをコンポーネントを追加で実装する。

ng g c [コンポーネント名]       ※こっちの方が楽
ng g component [コンポーネント名]

// 例）カレントフォルダにxxxコンポーネントを作成する
ng g c [コンポーネント名]
// 例）カレントフォルダにpagesフォルダを作成して、その中にxxxコンポーネントを作成する
ng g c pages/xxx

コンポーネント追加で以下ファイル一式が作成される。※cssはscssを指定した場合

バックエンドとの連携処理などの共通的な処理は、サービスを追加して実装する。

ng g s [サービス名]       ※こっちの方が楽
ng g service [サービス名]

// 例）カレントフォルダにxxxサービスを作成する
ng g s xxx
// 例）カレントフォルダにservicesフォルダを作成して、その中にxxxサービス作成する
ng g s services/xxx

サービス追加で以下ファイル一式が作成される。