Stack Overflow
Stack Overflow

Questions tagged [react-ssr]

55 questions
6
votes
1 answer

React SSR error -- Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object

My app has a simple routing with ssr and below is my code index.tsx import React from "react"; import ReactDOM from "react-dom"; import "./index.css"; import App from "./App"; import * as serviceWorker from "./serviceWorker"; import…
Giri
  • 451
  • 1
  • 4
  • 13
5
votes
0 answers

React SSR blinks when starting client

simplifying my post: my ssr webpage blinks when starting client which means page renders server side rendered html then goes blank and then it starts loading everything all over again. going through the details: i'm working on a react project…
zahra shahrouzi
  • 862
  • 7
  • 18
5
votes
0 answers

React -Server-side-rendering

I am using react 16.2.0 and doing SSR. My web app blink after hydration. So to find error or mismatch in server rendered HTML and client rendered HTML, I ran the code in development mode. Now it shows warning.js?6db0:33 Warning: Did not expect…
Uchit Kumar
  • 667
  • 10
  • 26
5
votes
1 answer

How to fetch data in react server side rendering based on dynamic routing path

Let's say I have a component like below. User extends React.Component { componentDidMount() { this.props.fetchUserDetails(this.props.params.userSlugName); // this slug name is coming from route params (ex: path is /users/:userSlugName) …
Akhil P
  • 1,580
  • 2
  • 20
  • 29
4
votes
1 answer

Razzle react not loading proper bundle when deployed

I generated a Razzle React app using yarn create-razzle-app my-app. I've deployed it to a nodeJS Elastic Beanstalk environment after building. After hitting the elastic beanstalk url, I see no CSS applied to the site. Running the same server locally…
Taylor Johnson
  • 1,845
  • 1
  • 18
  • 31
4
votes
2 answers

Adding CSS to React SSR Components

I am trying to add CSS to my component built in React using SSR, but I am unable to do so. Things I've looked at: https://www.npmjs.com/package/isomorphic-style-loader https://cssinjs.org/server-side-rendering/?v=v10.0.0-alpha.22 webpack…
Rahul Singh
  • 19,030
  • 11
  • 64
  • 86
4
votes
0 answers

Error handling with react SSR renderToNodeStream

I am trying to figure out how to properly error handle with react streams. Let say there is an error inside . What is the best way to catch the error? The catch block don't seem to be catching the error as it doesn't console.log anything when…
PBandJ
  • 2,537
  • 3
  • 21
  • 31
4
votes
1 answer

TypeError: element.type.toLowerCase is not a function

I am facing an issue while setting up SSR for a react app.The Server side code for the render is as below: app.use((req, res) => { const context = {} const body = ReactDOMServer.renderToString( React.createElement( …
user3062513
  • 410
  • 1
  • 10
  • 19
3
votes
0 answers

Catching errors from ReactDOM.render using Try/Catch

I'm trying to catch errors thrown from ReactDOM.render or ReactDOMServer.renderToString. I can't use componentDidCatch, because I'm trying to simulate an error thrown in SSR. I know that in SSR rendering there are no lifecycle hooks, so that's why…
Guy
  • 1,547
  • 1
  • 18
  • 29
3
votes
1 answer

How to fix self is not defined when firebase messaging method called in react ssr app?

I am trying to use firebase massaging in my SSR app which is created using https://github.com/jaredpalmer/razzle with-react-router-3. I am already using firebase which works great including hosting. But started throwing an error when I started…
Subhendu Kundu
  • 3,618
  • 6
  • 26
  • 57
3
votes
1 answer

Differentiating a component mounting or hydrating in React 16.1.1

I have a ScrollToTopOnMount as implemented here with componentDidMount(prevProps) { window.scrollTo(0, 0) } Which works great, except when I combine this with SSR and hydrating, my page snaps to the top when the hydration happens. Other answers…
Andrey Fedorov
  • 9,148
  • 20
  • 67
  • 99
2
votes
1 answer

How to make Google Auto Ads work with react SSR application

I want to use the Google Adsense Auto-Ads with my react application. The react application uses SSR and I have added the code that Google provided me to the head section of the template as shown below. export default ({ markup, css }) => { …
j-terranova
  • 539
  • 1
  • 10
  • 23
2
votes
0 answers

About using window and document in node-jsx and react-engine

I want to use .pug and .jsx as express view engine. I tried it with other modules like @react-ssr/express, but they didn't work. (It seems that my project is based on a open source project that lastly updated a few years ago) So, I'm using node-jsx…
user15758006
  • 31
  • 1
2
votes
0 answers

Unable to get json-ld information on react js SSR

We can see JsonLd information in client side rendering. When we render through server, the information is not available because of rendering and then fetching data (through API). we have tried the following but nothing works: fetch data in parent,…
M.R
  • 610
  • 2
  • 10
  • 34
2
votes
1 answer

How to properly hydrate react app with code splitting on client

I am building a react app and I did code splitting on the client for the bundle. My app properly render on the server as I am using SSR, I have no code Splitting on the server but on the client I do. I am getting the following warning on client with…
user8989
  • 580
  • 2
  • 6
  • 21
1
2 3 4