vite-impl-ssr

Implement Vite SSR workflows with Express middleware and production builds.

4|Updated Mar 20, 2026
One-click install
npx skills add https://github.com/OpenAEC-Foundation/OpenAEC-Workspace-Composer --skill vite-impl-ssr
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: vite-impl-ssr
Source: https://github.com/OpenAEC-Foundation/OpenAEC-Workspace-Composer/tree/main/.claude/skills/vite/vite-impl/vite-impl-ssr
Command: npx skills add https://github.com/OpenAEC-Foundation/OpenAEC-Workspace-Composer --skill vite-impl-ssr

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

SSR integration with Vite and Claude Code can be complex, risky, and error-prone; this skill provides a structured, safe blueprint to implement, debug, and optimize SSR workflows.

Core Features & Use Cases

  • Comprehensive SSR dev workflow guidance including Express middleware, ssrLoadModule, and manifest handling.
  • Best-practice recommendations for externals, production builds, and error debugging.
  • Real-world scenario coverage: from dev to production with proper tooling integration.

Quick Start

Create a minimal Vite SSR setup for a Claude Code project and verify SSR dev middleware works end-to-end.

Frequently Asked Questions about vite-impl-ssr

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I implement server-side rendering with Vite and Express middleware?

To implement server-side rendering with Vite, use Express middleware and the ssrLoadModule API during development to load and transform server entry points on demand. This workflow integrates directly with Vite's dev server for hot module replacement and SSR-specific error handling.

What is the best way to handle SSR error debugging in a Vite application?

The best way to handle SSR error debugging in Vite is to use the ssrFixStacktrace function. This corrects stack traces in server-side rendered applications, ensuring that error locations point accurately to your original source code rather than transformed build outputs.

How does Vite manage externals during a production SSR build?

Vite manages externals during a production SSR build by automatically externalizing dependencies listed in your package.json. This prevents Vite from bundling node_modules into the server output, optimizing the production build for fast and reliable server-side rendering.

Can I use Vite's transformIndexHtml for SSR entry point processing?

Yes, you can use Vite's transformIndexHtml for SSR entry point processing. It allows the server to inject scripts and styles into the HTML template during server-side rendering, ensuring proper asset loading and manifest handling in production builds.

What do I need to set up a minimal Vite SSR dev workflow?

You need a Vite project configured with a server entry point, an Express server using Vite's dev middleware, and the ssrLoadModule function to load server code. This minimal setup verifies that the SSR dev middleware works end-to-end.