これでコンポーネントの基本はわかりましたが、
「app」フォルダを見ると、この他にもファイルがあることに気づきます。それは、
index.tsと
environment.tsです。
index.tsは、この「app」内のコンポーネントにアクセスがあるときにデフォルトでロードされるものです。ここには、以下のような
export文が記述されています。
export * from './environment';
export * from './app.component';
これで、
environment.tsと
app.component.tsが、呼び出している側にエクスポートされ利用できるようになります。つまり、必要なスクリプトファイルを利用できるようにここで設定していたのですね。
environment.tsでは、以下のような単純な処理が用意されています。
export const environment = {
production: false
};これで、
environmentという定数がエクスポートされています。この
environmentは、正式公開版かどうかを示す
productionという値を持ったオブジェクトで、この
productionというプロパティの値を
trueにすれば、正式リリース版として扱われるようになっているのです。
■environmentはいらない？
この
environment.tsは、Angular CLIでプロジェクトを作成すると組み込まれる仕組みで、実はAngularでは必ずないといけないというわけではありません。「こんな仕組み、いらない」という場合は、取り除くこともできます。
1. index.tsを開き、
export * from './environment'; を削除します。
2. main.tsを開き、以下の文を修正する。
import { AppComponent, environment } from './app/';
↓
import { AppComponent } from './app/';3. main.tsにある以下の文を削除する。
if (environment.production) {
enableProdMode();
}これで、
environement.tsは使われなくなります。削除しても大丈夫です。Angularのサイトにある「５分でAngularアプリを作る」という説明では、この
environmentはありませんから、心配せずに消してしまってもいいですよ。