enhance(dev): frontendの検索インデックス作成を単独のコマンドで行えるように (#15653)

package.json

@@ -24,6 +24,7 @@
 		"build": "pnpm build-pre && pnpm -r build && pnpm build-assets",
 		"build-storybook": "pnpm --filter frontend build-storybook",
 		"build-misskey-js-with-types": "pnpm build-pre && pnpm --filter backend... --filter=!misskey-js build && pnpm --filter backend generate-api-json --no-build && ncp packages/backend/built/api.json packages/misskey-js/generator/api.json && pnpm --filter misskey-js update-autogen-code && pnpm --filter misskey-js build && pnpm --filter misskey-js api",
+		"build-frontend-search-index": "pnpm --filter frontend build-search-index",
 		"start": "pnpm check:connect && cd packages/backend && node ./built/boot/entry.js",
 		"start:test": "ncp ./.github/misskey/test.yml ./.config/test.yml && cd packages/backend && cross-env NODE_ENV=test node ./built/boot/entry.js",
 		"init": "pnpm migrate",

packages/frontend/lib/vite-plugin-create-search-index.ts

@@ -1428,6 +1428,23 @@ async function processVueFile(
 	};
 }
 
+export async function generateSearchIndex(options: Options, transformedCodeCache: Record<string, string> = {}) {
+	const filePaths = options.targetFilePaths.reduce<string[]>((acc, filePathPattern) => {
+		const matchedFiles = glob.sync(filePathPattern);
+		return [...acc, ...matchedFiles];
+	}, []);
+
+	for (const filePath of filePaths) {
+		const id = path.resolve(filePath); // 絶対パスに変換
+		const code = fs.readFileSync(filePath, 'utf-8'); // ファイル内容を読み込む
+		const { transformedCodeCache: newCache } = await processVueFile(code, id, options, transformedCodeCache); // processVueFile 関数を呼び出す
+		transformedCodeCache = newCache; // キャッシュを更新
+	}
+
+	await analyzeVueProps({ ...options, transformedCodeCache }); // 開発サーバー起動時にも analyzeVueProps を実行
+
+	return transformedCodeCache; // キャッシュを返す
+}
 
 // Rollup プラグインとして export
 export default function pluginCreateSearchIndex(options: Options): Plugin {
@@ -1445,19 +1462,7 @@ export default function pluginCreateSearchIndex(options: Options): Plugin {
 				return;
 			}
 
-			const filePaths = options.targetFilePaths.reduce<string[]>((acc, filePathPattern) => {
+			transformedCodeCache = await generateSearchIndex(options, transformedCodeCache);
-				const matchedFiles = glob.sync(filePathPattern);
-				return [...acc, ...matchedFiles];
-			}, []);
-
-			for (const filePath of filePaths) {
-				const id = path.resolve(filePath); // 絶対パスに変換
-				const code = fs.readFileSync(filePath, 'utf-8'); // ファイル内容を読み込む
-				const { transformedCodeCache: newCache } = await processVueFile(code, id, options, transformedCodeCache); // processVueFile 関数を呼び出す
-				transformedCodeCache = newCache; // キャッシュを更新
-			}
-
-			await analyzeVueProps({ ...options, transformedCodeCache }); // 開発サーバー起動時にも analyzeVueProps を実行
 		},
 
 		async transform(code, id) {

packages/frontend/package.json

@@ -5,6 +5,7 @@
 	"scripts": {
 		"watch": "vite",
 		"build": "vite build",
+		"build-search-index": "vite-node --config \"./vite-node.config.ts\" \"./scripts/generate-search-index.ts\"",
 		"storybook-dev": "nodemon --verbose --watch src --ext \"mdx,ts,vue\" --ignore \"*.stories.ts\" --exec \"pnpm build-storybook-pre && pnpm exec storybook dev -p 6006 --ci\"",
 		"build-storybook-pre": "(tsc -p .storybook || echo done.) && node .storybook/generate.js && node .storybook/preload-locale.js && node .storybook/preload-theme.js",
 		"build-storybook": "pnpm build-storybook-pre && storybook build --webpack-stats-json storybook-static",
@@ -133,6 +134,7 @@
 		"start-server-and-test": "2.0.10",
 		"storybook": "8.6.4",
 		"storybook-addon-misskey-theme": "github:misskey-dev/storybook-addon-misskey-theme",
+		"vite-node": "3.0.8",
 		"vite-plugin-turbosnap": "1.0.3",
 		"vitest": "3.0.8",
 		"vitest-fetch-mock": "0.4.5",

packages/frontend/scripts/generate-search-index.ts

@@ -0,0 +1,15 @@
+/*
+ * SPDX-FileCopyrightText: syuilo and misskey-project
+ * SPDX-License-Identifier: AGPL-3.0-only
+ */
+
+import { searchIndexes } from '../vite.config.js';
+import { generateSearchIndex } from '../lib/vite-plugin-create-search-index.js';
+
+async function main() {
+	for (const searchIndex of searchIndexes) {
+		await generateSearchIndex(searchIndex);
+	}
+}
+
+main();

packages/frontend/vite-node.config.ts

@@ -0,0 +1,3 @@
+import { defineConfig } from 'vite';
+
+export default defineConfig({});

packages/frontend/vite.config.ts

@@ -1,7 +1,8 @@
 import path from 'path';
 import pluginReplace from '@rollup/plugin-replace';
 import pluginVue from '@vitejs/plugin-vue';
-import { type UserConfig, defineConfig } from 'vite';
+import { defineConfig } from 'vite';
+import type { UserConfig } from 'vite';
 import * as yaml from 'js-yaml';
 import { promises as fsp } from 'fs';
 
@@ -11,12 +12,22 @@ import packageInfo from './package.json' with { type: 'json' };
 import pluginUnwindCssModuleClassName from './lib/rollup-plugin-unwind-css-module-class-name.js';
 import pluginJson5 from './vite.json5.js';
 import pluginCreateSearchIndex from './lib/vite-plugin-create-search-index.js';
+import type { Options as SearchIndexOptions } from './lib/vite-plugin-create-search-index.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'];
 
+/**
+ * 検索インデックスの生成設定
+ */
+export const searchIndexes = [{
+	targetFilePaths: ['src/pages/settings/*.vue'],
+	exportFilePath: './src/utility/autogen/settings-search-index.ts',
+	verbose: process.env.FRONTEND_SEARCH_INDEX_VERBOSE === 'true',
+}] satisfies SearchIndexOptions[];
+
 /**
  * Misskeyのフロントエンドにバンドルせず、CDNなどから別途読み込むリソースを記述する。
  * CDNを使わずにバンドルしたい場合、以下の配列から該当要素を削除orコメントアウトすればOK
@@ -84,11 +95,7 @@ export function getConfig(): UserConfig {
 		},
 
 		plugins: [
-			pluginCreateSearchIndex({
+			...searchIndexes.map(options => pluginCreateSearchIndex(options)),
-				targetFilePaths: ['src/pages/settings/*.vue'],
-				exportFilePath: './src/utility/autogen/settings-search-index.ts',
-				verbose: process.env.FRONTEND_SEARCH_INDEX_VERBOSE === 'true',
-			}),
 			pluginVue(),
 			pluginUnwindCssModuleClassName(),
 			pluginJson5(),

pnpm-lock.yaml

@@ -1040,6 +1040,9 @@ importers:
       storybook-addon-misskey-theme:
         specifier: github:misskey-dev/storybook-addon-misskey-theme
         version: https://codeload.github.com/misskey-dev/storybook-addon-misskey-theme/tar.gz/cf583db098365b2ccc81a82f63ca9c93bc32b640(@storybook/blocks@8.6.4(react-dom@19.0.0(react@19.0.0))(react@19.0.0)(storybook@8.6.4(bufferutil@4.0.9)(prettier@3.5.3)(utf-8-validate@6.0.5)))(@storybook/components@8.6.4(storybook@8.6.4(bufferutil@4.0.9)(prettier@3.5.3)(utf-8-validate@6.0.5)))(@storybook/core-events@8.6.4(storybook@8.6.4(bufferutil@4.0.9)(prettier@3.5.3)(utf-8-validate@6.0.5)))(@storybook/manager-api@8.6.4(storybook@8.6.4(bufferutil@4.0.9)(prettier@3.5.3)(utf-8-validate@6.0.5)))(@storybook/preview-api@8.6.4(storybook@8.6.4(bufferutil@4.0.9)(prettier@3.5.3)(utf-8-validate@6.0.5)))(@storybook/theming@8.6.4(storybook@8.6.4(bufferutil@4.0.9)(prettier@3.5.3)(utf-8-validate@6.0.5)))(@storybook/types@8.6.4(storybook@8.6.4(bufferutil@4.0.9)(prettier@3.5.3)(utf-8-validate@6.0.5)))(react-dom@19.0.0(react@19.0.0))(react@19.0.0)
+      vite-node:
+        specifier: 3.0.8
+        version: 3.0.8(@types/node@22.13.9)(sass@1.85.1)(terser@5.39.0)(tsx@4.19.3)
       vite-plugin-turbosnap:
         specifier: 1.0.3
         version: 1.0.3