merge upstream 2025-02-03

packages/frontend-embed/vite.config.ts

@@ -2,12 +2,18 @@ import path from 'path';
 import pluginVue from '@vitejs/plugin-vue';
 import { type UserConfig, defineConfig } from 'vite';
 import { localesVersion } from '../../locales/version.js';
+import * as yaml from 'js-yaml';
+import { promises as fsp } from 'fs';
+
 import locales from '../../locales/index.js';
 import meta from '../../package.json';
 import packageInfo from './package.json' with { type: 'json' };
 import pluginJson5 from './vite.json5.js';
 import { pluginReplaceIcons } from '../frontend/vite.replaceIcons.js';
 
+const url = process.env.NODE_ENV === 'development' ? yaml.load(await fsp.readFile('../../.config/default.yml', 'utf-8')).url : null;
+const host = url ? (new URL(url)).hostname : undefined;
+
 const extensions = ['.ts', '.tsx', '.js', '.jsx', '.mjs', '.json', '.json5', '.svg', '.sass', '.scss', '.css', '.vue'];
 
 /**
@@ -63,7 +69,14 @@ export function getConfig(): UserConfig {
 		base: '/embed_vite/',
 
 		server: {
+			host,
 			port: 5174,
+			hmr: {
+				// バックエンド経由での起動時、Viteは5174経由でアセットを参照していると思い込んでいるが実際は3000から配信される
+				// そのため、バックエンドのWSサーバーにHMRのWSリクエストが吸収されてしまい、正しくHMRが機能しない
+				// クライアント側のWSポートをViteサーバーのポートに強制させることで、正しくHMRが機能するようになる
+				clientPort: 5174,
+			},
 		},
 
 		plugins: [