はじめに
AngularはJavaScript系のフレームワークでは現在もっとも有名なプロダクトの一つだ。
大規模サイト構築を意識した設計になっているのが特徴で、Googleが中心となって開発が進められている。
セットアップを簡単に行えるような配慮もなされていて、プロジェクトのひな型などはすぐに作成できる。
ただ、簡単さの引き換えとして、ディレクトリー名などは自動的に決められてしまう場合が多い。
ソース用のディレクトリーもそのうちの一つだ。
デフォルトではプロジェクトの直下の src という名前が自動的に付けられてしまう。
一つのプロジェクト内に複数のソースディレクトリーが共存しているようなケースだと、この自動的な命名が不都合となる場合がある。
ソースディレクトリーの変更方法
僕がかかわったとあるプロジェクトでは、プロジェクト内にサーバー側フレームワークのソースが共存していた。
こちらのソースディレクトリー名は、server になっていた。
このような状況だと、Angularで使用するソースディレクトリーは client にした方が分かりやすい。
ソースディレクトリーの情報を管理しているファイルは、プロジェクト直下にある angular.json だ。
projects -> (プロジェクト名) -> sourceRoot の値がソースディレクトリー名になる。
この値を src から好みの値に変更してやればよい。
以下は、hohara という名前のプロジェクトで変更を実施した場合の例となる。
angular.json の8行目に sourceRoot の行がある。
この例では、前述の通りsrc を client に変更している。
なお、アプリのビルドなどにも、Angular や周辺ツールを利用している場合は、それらの設定も修正が必要だ。
今回の例では、ビルドにも Angular の機能を使っているため、上図16行目以下の各行において src を client に変更している。
変更がうまく機能したかどうかは、コンパイルして確認をしておくのがよいだろう。
以下のようなメッセージが出力されれば変更は成功だ。
なお、この記事を書くのに参考にした Angular のバージョンは7になる。
まとめ
Angularをセットアップした時に自動的に作成されるソースディレクトリーは後から変更が可能。
ソースディレクトリーを変更するには、プロジェクト直下にある angular.json を修正すればよい。