deps: Update vite to v8 (#17238)

* deps: Update vite to v8

* fix

* migrate some plugins to rolldown-based

* fix broken lockfile

* wip

* update rolldown

* override rolldown version

* perf

* spdx

* fix

* update vite to 8.0.1

* chore: rewrite rollup-plugin-unwind-css-module-class-name with MagicString

* format

* swap type definitions

* replace using MagicString

* provided magicString

* fix code style

* fix

* fix

* fix

* fix

* fix

---------

Co-authored-by: kakkokari-gtyih <67428053+kakkokari-gtyih@users.noreply.github.com>

* fix: lint fixes

* swap sass with sass-embedded

* fix lint

* fix: インライン化されたVue SFC出力に対してCSS Module定義削除が効かないのを修正

* fix

* fix: バックエンドのCSS読み込みの方法が悪いのを修正

* fix: 使用されないpreloadを削除

* fix lint [ci skip]

* Apply suggestion from @syuilo

* Add comment in pnpm-workspace.yaml [ci skip]

* update vite/rolldown

* remove magic-string

---------

Co-authored-by: cm-ayf <cm.ayf2734@gmail.com>
Co-authored-by: syuilo <4439005+syuilo@users.noreply.github.com>

packages/frontend-embed/build.ts

@@ -3,7 +3,7 @@ import url from 'node:url';
 import path from 'node:path';
 import { execa } from 'execa';
 import locales from 'i18n';
-import { LocaleInliner } from '../frontend-builder/locale-inliner.js'
+import { LocaleInliner } from '../frontend-builder/locale-inliner.js';
 import { createLogger } from '../frontend-builder/logger';
 
 // requires node 21 or later

packages/frontend-embed/lib/vite-plugin-json5.ts

@@ -1,7 +1,10 @@
-// Original: https://github.com/rollup/plugins/tree/8835dd2aed92f408d7dc72d7cc25a9728e16face/packages/json
+/*
+ * SPDX-FileCopyrightText: syuilo and misskey-project
+ * SPDX-License-Identifier: AGPL-3.0-only
+ */
 
 import JSON5 from 'json5';
-import { Plugin } from 'rollup';
+import { Plugin } from 'vite';
 import { createFilter, dataToEsm } from '@rollup/pluginutils';
 import { RollupJsonOptions } from '@rollup/plugin-json';
 

packages/frontend-embed/package.json

@@ -12,7 +12,6 @@
 	"dependencies": {
 		"@discordapp/twemoji": "16.0.1",
 		"@rollup/plugin-json": "6.1.0",
-		"@rollup/plugin-replace": "6.0.3",
 		"@rollup/pluginutils": "5.3.0",
 		"@twemoji/parser": "16.0.0",
 		"@vitejs/plugin-vue": "6.0.5",
@@ -26,11 +25,9 @@
 		"misskey-js": "workspace:*",
 		"punycode.js": "2.3.1",
 		"rollup": "4.60.0",
-		"sass": "1.98.0",
 		"shiki": "3.23.0",
 		"tinycolor2": "1.6.0",
 		"uuid": "13.0.0",
-		"vite": "7.3.1",
 		"vue": "3.5.30"
 	},
 	"devDependencies": {
@@ -57,8 +54,10 @@
 		"msw": "2.12.14",
 		"nodemon": "3.1.14",
 		"prettier": "3.8.1",
+		"sass-embedded": "1.98.0",
 		"start-server-and-test": "2.1.5",
 		"tsx": "4.21.0",
+		"vite": "8.0.2",
 		"vite-plugin-turbosnap": "1.0.3",
 		"vue-component-type-helpers": "3.2.6",
 		"vue-eslint-parser": "10.4.0",

packages/frontend-embed/vite.config.ts

@@ -7,10 +7,10 @@ import { promises as fsp } from 'fs';
 import locales from 'i18n';
 import meta from '../../package.json';
 import packageInfo from './package.json' with { type: 'json' };
-import pluginJson5 from './vite.json5.js';
+import pluginJson5 from './lib/vite-plugin-json5.js';
 import { pluginRemoveUnrefI18n } from '../frontend-builder/rollup-plugin-remove-unref-i18n';
 
-const url = process.env.NODE_ENV === 'development' ? yaml.load(await fsp.readFile('../../.config/default.yml', 'utf-8')).url : null;
+const url = process.env.NODE_ENV === 'development' ? (yaml.load(await fsp.readFile('../../.config/default.yml', 'utf-8')) as any).url : null;
 const host = url ? (new URL(url)).hostname : undefined;
 
 const extensions = ['.ts', '.tsx', '.js', '.jsx', '.mjs', '.json', '.json5', '.svg', '.sass', '.scss', '.css', '.vue'];
@@ -113,11 +113,6 @@ export function getConfig(): UserConfig {
 					}
 				},
 			},
-			preprocessorOptions: {
-				scss: {
-					api: 'modern-compiler',
-				},
-			},
 		},
 
 		define: {
@@ -137,7 +132,10 @@ export function getConfig(): UserConfig {
 				'safari16',
 			],
 			manifest: 'manifest.json',
-			rollupOptions: {
+			rolldownOptions: {
+				experimental: {
+					nativeMagicString: true,
+				},
 				input: {
 					i18n: './src/i18n.ts',
 					entry: './src/boot.ts',
@@ -145,10 +143,15 @@ export function getConfig(): UserConfig {
 				external: externalPackages.map(p => p.match),
 				preserveEntrySignatures: 'allow-extension',
 				output: {
-					manualChunks: {
-						vue: ['vue'],
-						// dependencies of i18n.ts
-						'config': ['@@/js/config.js'],
+					codeSplitting: {
+						groups: [{
+							name: 'vue',
+							test: /node_modules[\\/]vue/,
+						}, {
+							// dependencies of i18n.ts
+							name: 'config',
+							test: /@@[\\/]js[\\/]config\.js/,
+						}],
 					},
 					entryFileNames: `scripts/${localesHash}-[hash:8].js`,
 					chunkFileNames: `scripts/${localesHash}-[hash:8].js`,