ViteでVue.jsアプリケーションを起動するときのポート番号を指定する

ViteでVue.jsアプリケーションを起動するときのポート番号を指定する

Vue.jsアプリケーション開発で、Viteを導入すると、こちらのコマンドで起動できます。

npm run dev

デフォルトでは、listenポートが5173となっています。
これを変更してみたいと思いやり方を調べました。

viteの設定ファイル(vite.config.js / vite.config.ts)を以下のように、編集すれば出来ました。
ポート番号3000に変更する例です。

編集前

export default defineConfig({
  plugins: [
		vue(),
	]
})

編集後

export default defineConfig({
  plugins: [
		vue()
	],
  server: {
	port: 3000
  }
})

公式サイトのサーバオプションは、同じように設定できるようなので、覚えておきたい。