Angular CLI サーバーでデフォルトポートを指定する方法
Angular CLI サーバーでデフォルトポートを指定する方法
デフォルトポートを変更するには、次の方法があります。
- ng serve コマンドに --port オプションを使用する
ng serve --port 8080
このコマンドは、サーバーをポート 8080 で実行します。
- angular.json ファイルを変更する
angular.json
ファイルには、Angular アプリケーションのビルドと実行に関する設定が含まれています。このファイルの serve
プロパティを変更することで、デフォルトポートを設定できます。
{
"projects": {
"my-app": {
"architect": {
"serve": {
"options": {
"port": 8080
}
}
}
}
}
}
この設定は、ng serve
コマンドを実行するたびに適用されます。
- 環境変数を使用する
NG_SERVE_PORT
という環境変数を設定することで、デフォルトポートを設定できます。
NG_SERVE_PORT=8080 ng serve
この方法は、コマンドラインからサーバーを実行する場合にのみ有効です。
使用例
次の例は、デフォルトポートを変更する方法を示しています。
- ポート 8080 でサーバーを実行する
ng serve --port 8080
- angular.json ファイルを使用してポート 8080 をデフォルトポートとして設定する
{
"projects": {
"my-app": {
"architect": {
"serve": {
"options": {
"port": 8080
}
}
}
}
}
}
NG_SERVE_PORT=8080 ng serve
注意点
- デフォルトポートを変更する前に、そのポートが使用されていないことを確認してください。
- ポート 80 は、通常、Web サーバーで使用されます。別のポートを使用することをお勧めします。
{
"projects": {
"my-app": {
"architect": {
"serve": {
"options": {
"port": 8080
}
}
}
}
}
}
この設定を使用すると、ng serve
コマンドを実行するたびに、サーバーはポート 8080 で実行されます。
以下のサンプルコードは、その他の方法でデフォルトポートを設定する方法を示しています。
ng serve --port 8080
NG_SERVE_PORT=8080 ng serve
これらのサンプルコードは、デフォルトポートを変更する方法を理解するのに役立ちます。
Angular CLI サーバーでデフォルトポートを指定するその他の方法
.env ファイルを使用する
.env ファイル
NG_SERVE_PORT=8080
コマンドライン
ng serve
.env
ファイルは、プロジェクトのルートディレクトリに配置する必要があります。
nginx などの Web サーバーを使用している場合は、Web サーバーの設定を使用してデフォルトポートを設定できます。
nginx 設定ファイル
server {
listen 80;
server_name localhost;
location / {
proxy_pass http://localhost:8080;
}
}
この設定は、ポート 80 でアクセスされたリクエストを、ポート 8080 で実行されている Angular CLI サーバーに転送します。
systemd サービスファイルを使用する
systemd を使用している場合は、systemd サービスファイルを使用してデフォルトポートを設定できます。
systemd サービスファイル
[Unit]
Description=Angular CLI Server
[Service]
Type=simple
ExecStart=ng serve --port=8080
Restart=always
[Install]
WantedBy=multi-user.target
このサービスファイルは、systemd によって自動的に Angular CLI サーバーをポート 8080 で起動するように設定します。
Docker を使用している場合は、Dockerfile でデフォルトポートを設定できます。
Dockerfile
FROM node:16
WORKDIR /app
COPY package.json .
RUN npm install
COPY . .
RUN ng build --prod
CMD ng serve --port=8080
この Dockerfile は、Angular アプリケーションをポート 8080 で実行する Docker イメージをビルドします。
上記の方法のいずれかを使用して、Angular CLI サーバーのデフォルトポートを指定することができます。ニーズに最適な方法を選択してください。
angular angular-cli