- ポート番号の指定: Reactプロジェクトを実行するポート番号を指定するために、package.jsonファイル内の"scripts"セクションを編集します。通常、"start"スクリプトがデフォルトの開発用ポート(通常は3000)を使用してReactアプリケーションを起動します。これをカスタマイズするには、"start"スクリプトを次のように変更します。
"scripts": {
"start": "react-scripts start --port 5000"
}
上記の例では、ポート番号5000を使用してReactアプリケーションを起動します。
- 環境変数の使用: もう1つの方法は、環境変数を使用してポート番号を指定する方法です。環境変数を使用する場合、以下の手順に従います。
-
Unix/Linux/macOS:
PORT=5000 npm run dev
-
Windows (PowerShell):
$env:PORT=5000; npm run dev
これにより、ポート番号5000でReactアプリケーションが起動します。
- .envファイルの使用: Reactアプリケーションのルートディレクトリに、.envファイルを作成することもできます。このファイルにポート番号を指定し、環境変数を使用する方法と同様に、Reactアプリケーションを起動します。
.envファイルの例:
PORT=5000
上記の例では、ポート番号5000を使用してReactアプリケーションが起動します。
これらの方法を使用すると、Reactプロジェクトをカスタムポートで実行することができます。必要に応じて、他のポート番号を選択してください。