Upgrade XBuilder frontend to Vite 8

[nighca]

close #2953

Summary

• upgrade spx-gui from Vite 6 to Vite 8 and update related Vite ecosystem packages
• replace the stale vite-plugin-vercel dependency with a local Vercel output plugin compatible with the new toolchain
• remove vite-plugin-vue-devtools to avoid unnecessary Vite peer dependency warnings during install
• preserve the generic createTask mock signature so vue-tsc passes again

Validation

• npm install
• npm run lint
• npm run test -- --run
• npm run type-check
• npx vite build --mode production
• verified .vercel/output/static matches dist
• verified generated .vercel/output/config.json
• browser smoke-tested key routes and interactions under the Vite 8 dev server

Benchmark

• measured on the same machine with 3 warm runs per command
• npm run build: current branch average 11.80s, dev average 24.61s (52.1% faster, about 2.09x)
• npx vite build --mode production: current branch average 3.13s, dev average 14.15s (77.9% faster, about 4.52x)

Vercel Preview Check

• inspected the latest preview deployment for this PR on Vercel: C5NFYW3hw (26c8a37), status Ready, total duration 2m 8s
• opened the deployed preview at https://builder-bpjhuoqrf-xgo-team.vercel.app/ and confirmed it loaded normally
• checked the deployment detail page and saw no obvious deployment/runtime issues; the runtime logs view was empty for the inspected time range
• compared with nearby successful deployments on the same Vercel deployments page, which were around 2m 40s to 2m 47s, this run was about 32s to 39s faster
• compared with previous successful deployments from this PR branch itself, which were around 2m 5s to 2m 10s, the latest run was effectively unchanged rather than another large step down

[gemini-code-assist]

Summary of Changes

Hello, I'm Gemini Code Assist¹! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed!

This pull request focuses on modernizing the frontend build system for spx-gui by upgrading Vite to its latest major version. This update not only brings performance improvements and new features from Vite 8 but also streamlines the Vercel deployment process by integrating a custom output plugin, ensuring better control over build artifacts and deployment configurations.

Highlights

• Vite Upgrade: Upgraded the spx-gui frontend from Vite 6 to Vite 8, along with updating related Vite ecosystem packages like @vitejs/plugin-vue and vitest.
• Vercel Output Plugin: Replaced the external vite-plugin-vercel dependency with a new, locally implemented Vercel output plugin to ensure compatibility with the updated toolchain and provide custom configuration for headers and rewrites.
• Plugin Removal: Removed vite-plugin-vue-devtools to prevent unnecessary Vite peer dependency warnings during installation.

🧠 New Feature in Public Preview: You can now enable Memory to help Gemini Code Assist learn from your team's feedback. This makes future code reviews more consistent and personalized to your project's style. Click here to enable Memory in your admin console.

Changelog

• spx-gui/package.json
  • Updated @vitejs/plugin-vue from ^6.0.2 to ^6.0.5.
  • Updated vite from ^6.4.1 to ^8.0.0.
  • Removed vite-plugin-vercel dependency.
  • Removed vite-plugin-vue-devtools dependency.
  • Updated vitest from ^3.2.4 to ^4.1.0.
• spx-gui/tsconfig.node.json
  • Added vercel-output-plugin.ts to the include array for TypeScript compilation.
• spx-gui/vercel-output-plugin.ts
  • Added a new TypeScript file containing the implementation of a custom Vite plugin for generating Vercel-compatible output, including static assets, config.json, headers, and rewrite rules.
• spx-gui/vite.config.ts
  • Removed imports for VueDevTools and vite-plugin-vercel.
  • Imported createVercelOutputPlugin from the new local plugin file.
  • Replaced the vercel() plugin call with createVercelOutputPlugin and its detailed configuration for headers and rewrites.
  • Removed the conditional inclusion of VueDevTools() plugin.
  • Changed rollupOptions to rolldownOptions within the build configuration, reflecting Vite 8 changes.
  • Removed the top-level vercel configuration object.

Activity

• No human activity has been recorded on this pull request yet.

Using Gemini Code Assist

The full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips.

Invoking Gemini

You can request assistance from Gemini at any point by creating a comment using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands on the current page.

Feature	Command	Description
Code Review	/gemini review	Performs a code review for the current pull request in its current state.
Pull Request Summary	/gemini summary	Provides a summary of the current pull request in its current state.
Comment	@gemini-code-assist	Responds in comments when explicitly tagged, both in pull request comments and review comments.
Help	/gemini help	Displays a list of available commands.

Customization

To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a .gemini/ folder in the base of the repository. Detailed instructions can be found here.

Limitations & Feedback

Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for GitHub and other Google products, sign up here.

You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension.

Footnotes

1. Review the Privacy Notices, Generative AI Prohibited Use Policy, Terms of Service, and learn how to configure Gemini Code Assist in GitHub here. Gemini can make mistakes, so double check it and use code with caution. ↩

[gemini-code-assist]

Code Review

This pull request upgrades the frontend from Vite 6 to Vite 8, along with related dependencies like vitest. It also replaces the vite-plugin-vercel with a custom local plugin to support the new toolchain. The changes are well-structured, and the new local plugin is clearly written. I have one suggestion to improve the robustness of the Vite configuration by validating an environment variable to prevent potential runtime issues.

[Copilot]

Pull request overview

Upgrades the spx-gui frontend build toolchain from Vite 6 to Vite 8 (which uses Rolldown instead of Rollup), updates related ecosystem packages, replaces vite-plugin-vercel with a local Vercel output plugin, and removes vite-plugin-vue-devtools.

Changes:

• Upgraded vite to ^8.0.0, vitest to ^4.1.0, and @vitejs/plugin-vue to ^6.0.5; removed vite-plugin-vercel and vite-plugin-vue-devtools
• Added a local vercel-output-plugin.ts that generates Vercel Build Output API v3 artifacts, replacing the third-party plugin
• Changed rollupOptions to rolldownOptions in the build config to match Vite 8's Rolldown bundler, and added a type assertion in the mock file for stricter type checking

Reviewed changes

Copilot reviewed 5 out of 6 changed files in this pull request and generated no comments.

Show a summary per file

File	Description
spx-gui/package.json	Bumped vite, vitest, plugin-vue versions; removed vercel and devtools plugins
spx-gui/vite.config.ts	Replaced plugins, moved Vercel config inline, renamed rollupOptions to rolldownOptions
spx-gui/vercel-output-plugin.ts	New local plugin generating .vercel/output with config.json and static copy
spx-gui/tsconfig.node.json	Added new plugin file to the node tsconfig includes
spx-gui/src/models/spx/gen/aigc-mock.ts	Added as typeof this.createTask to preserve generic signature under stricter types
spx-gui/package-lock.json	Regenerated lock file reflecting all dependency changes

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[xgopilot]

Clean upgrade — the local Vercel output plugin is a solid replacement for the stale vite-plugin-vercel, and the Rolldown-backed build speed gains are significant. A few correctness issues in vercel-output-plugin.ts are worth addressing before merge: the SPA fallback regex may not match the root path /, arbitrary source strings are passed through as raw regex without metacharacter escaping, and the fs.rm targets more of .vercel/output/ than it needs to.

[nighca]

Addressed the correctness concerns from the robot review in e67802b: the local Vercel output plugin now uses safer route-pattern conversion, validates the proxied API base URL when rewrite routes are emitted, narrows cleanup to static output plus config.json, and writes config.json in parallel with the static copy. I also re-ran type-check and a production build after the change.