Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

React SSR not working in Production Build.

See original GitHub issue

Describe the bug

I managed to get SSR with React and Vite working with the command “vite” but when i try to build with “vite build” and serve it with “vite preview” SSR got not working. The code is Public and i want to Maintain it as a good template: https://github.com/Trackhe/Vite-React-SSR-HMR

Reproduction

Reproduction clone my code, then npm i -> npm run dev try all works. shutdown and try npm run preview, look in the loaded document now no SSR

System Info

System:
    OS: macOS 12.4
    CPU: (20) arm64 Apple M1 Ultra
    Memory: 19.76 GB / 64.00 GB
    Shell: 5.8.1 - /bin/zsh
  Binaries:
    Node: 18.0.0 - /opt/homebrew/bin/node
    Yarn: 1.22.19 - /opt/homebrew/bin/yarn
    npm: 8.10.0 - /opt/homebrew/bin/npm
  Browsers:
    Chrome: 102.0.5005.61
    Safari: 15.5
  npmPackages:
    @vitejs/plugin-react: * => 1.3.2 
    vite: * => 2.9.9

Used Package Manager

npm

Logs

No response

Validations

Follow our Code of Conduct
Read the Contributing Guidelines.
Read the docs.
Check that there isn’t already an issue that reports the same bug to avoid creating a duplicate.
Make sure this is a Vite issue and not a framework-specific issue. For example, if it’s a Vue SFC related bug, it should likely be reported to https://github.com/vuejs/core instead.
Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
The provided reproduction is a minimal reproducible example of the bug.

Issue Analytics

State:
Created a year ago
Comments:8 (4 by maintainers)

Top GitHub Comments

1reaction

bluwycommented, Jun 5, 2022

I’ll close this as it doesn’t seem to be a bug in Vite, but more of a usage issue. Re configurePreviewServer, the feature has been backported to the v2 branch and will make it’s way in 2.9.10 when it’s released.

0reactions

Trackhecommented, Jun 4, 2022

When i try that i got errors like no loader for .svg is configured and when i comment that out TypeError: server.transformIndexHtml is not a function and there is where i dont know to continue.

Top Results From Across the Web

Server side rendering not work on production build Next.js

I'm new on Next.js and my previous apps on react can't do server side rendering, so i a bit confuse about it. Any...

Server Side Rendering Not Work On Production ... - ADocLib

Server Side Rendering Not Work On Production Build Next.Js. Server-side rendering (SSR) is a popular technique for rendering a client-side in this tutorial ......

How to Enable Server-Side Rendering for a React App

In this tutorial, you will initialize a React app using Create React App and then modify the project to enable server-side rendering.

Improve app performance with React server-side rendering

In this article, we'll investigate different types of rendering for web applications.

Build Your Own SSR/SSG From Scratch with Vite and React

It means server actually doing the heavy lifting before responding to the upcoming requests. If you are doing SSR with React you will...