libro
www.tuyano.com
初心者のためのAngular2入門

Angularをセットアップする (3/4)

作成:2016-08-06 09:16
更新:2016-08-06 09:16

■Angularアプリケーションの構成

作成されたAngularアプリケーションの中には、多数のファイルやフォルダがぎっしりと入っています。これは、Angular CLIが、基本的にnpmを利用してパッケージをインストールしているため、Node.js関連のパッケージが多数組み込まれているのです。

アプリケーション内にあるファイル類は、その多くがJSONファイルです。これらは、各種ツールの設定情報を記述したものと考えてください。これらを直接編集することはあまりないでしょう。フォルダ類については、基本的な役割を頭に入れておきましょう。

「.git」フォルダ――Git関連のファイルが入っています。
「config」フォルダ――設定関係のファイルです。
「e2d」フォルダ――end-to-endテスト関連のファイルです。
「public」フォルダ――公開フォルダです。ここにWebのリソース類を用意します。
「src」フォルダ――これがWebページ関連のファイルをまとめてあるところです。


■「src」フォルダの中身

アプリケーションで表示するWebページのファイルは、「src」フォルダの中にまとめられています。この部分が、実質的にAngularアプリの中心部分と考えてよいでしょう。この「src」フォルダ内には、以下のようなファイル類が用意されています。

「app」フォルダ――Angularのコンポーネント類がまとめられています。
favicon.ico――アイコンのファイルですね。
index.html――これがデフォルトで表示されるWebページになります。
main.ts――起動時に実行されるスクリプトです。
system-config.ts――SystemJSというライブラリの設定ファイルです。
tsconfig.json――TypeScriptの設定ファイルです。
typings.d.ts――TypingsというTypeScript定義マネージャの設定ファイルです。

これらの中に、「ts」という拡張子のファイルがあるのに気がついたことでしょう。これは、TypeScriptのスクリプトファイルです。Angularでは、JavaScriptだけでなくTypeScriptも利用できます。Angular CLIで生成されるプロジェクトは、デフォルトでTypeScriptを使うようになっているのです。

※プログラムリストが表示されない場合

AddBlockなどの広告ブロックツールがONになっていると、プログラムリスト等が表示されない場合があります。これらのツールをOFFにしてみてください。

※関連コンテンツ

「初心者のためのAngular2入門」に戻る