55 questions
0
votes
1
answer
490
views
Remix hydration error when rendering current time [duplicate]
I was playing around with Remix when I ran into an unexpected error.
Basically, I'm trying to render a clock on my web page that prints the current time accurate to seconds. However, I've noticed the ...
1
vote
0
answers
231
views
How to fix this issue , entry-server.tsx:6:5: ERROR: Expected ")" but found "?" , /entry-client.tsx:7:34: ERROR: Expected ")" but found "as"
Im trying to migrate a existing react js app built using cra , to vite ssr . I have installed all the dep packages and moved all the code . while im trying to run the project using npm run dev . I end ...
- 21
1
vote
0
answers
284
views
SSR classNames issue with React, Express and ChakraUI components
I have a simple project where I am exposing the built FE project (which has React and ChakraUI) through an express server. Things go well until I import a Box component from chakra. It gets rendered ...
- 111
0
votes
1
answer
515
views
Using Framer-motion with NextJS (v13.x.x) and getting error: "Prop `data-projection-id` did not match. Server: "null" Client: "4" at li"
Using framer motion in one of my Next JS project.
Getting an unusual console error while trying reloading the page.
The page is using SSR from the most recent version of Next JS (V13.X.X).
Error ...
- 197
0
votes
0
answers
1k
views
React-SSR: You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file
I am trying to implement SSR in React and I am using webpack and babel configuration.
webpack.shared.config.js
module.exports = {
mode: "development",
module: {
rules: [
{
...
- 609
2
votes
0
answers
2k
views
Is seeing console.log on client expected for SSR? (Next JS)
I've created a simple page to test SSR implementation. There is one thing I couldn't be sure. If you could help to understand would be great!
const EmptyPage = () => {
console.log("rendered !...
- 3,155
0
votes
1
answer
293
views
Problem implementing react-ssr-adsense package
I am trying to get google adsense to work with my application. I have a react SSR application so I am trying to implement the react-ssr-adsense package. Code changes to implement include installing ...
- 659
2
votes
1
answer
2k
views
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 ...
- 659
1
vote
0
answers
138
views
React SSR with redux and webpack Gtmetrix score not increases after optimization
Below is the webpack production file
const webpack = require("webpack");
const path = require('path');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const ...
- 116
2
votes
1
answer
1k
views
Next Js dynamic i18n subfolder
I am currently working with a headless WordPress site in Next.js. I struggle a bit with the routing for internationalization.
I have 2 main page files relevant for this question:
pages/[...slug].tsx
...
- 201
2
votes
0
answers
40
views
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 ...
- 31
-1
votes
1
answer
572
views
How does browser converts HTML string received from server in react server side rendering into HTML DOM elements?
I have started learning React Server Side Rendering. Then I configured "index.js" file as follows:
const express = require('express');
const app = express();
const React = require('react');
...
4
votes
0
answers
282
views
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 ...
- 650
6
votes
0
answers
2k
views
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 ...
- 1,012
1
vote
1
answer
2k
views
gifsicle binary not found while starting reactjs app
We use gifsicle version 5.1.0 in package.json, but the application start throws the following error. It is expecting a binary gifsicle under node_modules/gifsicle/vendor folder but trying to start the ...
- 6,198
0
votes
1
answer
5k
views
Largest Contentful Paint timing really slow even though the largest content is loaded from the beginning
I am using react ssr with styled component and the google speed test says the largest content load speed is pretty slow.
First paint time takes about 1.1s and the largest content for my site is image ...
- 1,302
1
vote
1
answer
4k
views
Next Js dynamic subpath
I am currently working on a next.js app and so far so good, all has been going on fine but my client wants a feature that's quite difficult for me to implement.
SO the site is at mysite.com and routes ...
- 751
0
votes
1
answer
155
views
Did not expect server HTML to contain a <ins> in <ins> - AdSense ad within react hybrid
I have a little problem with loading AdSense ads with react. The site is based on asp.net and I normally render react components on the server-side using @Html.React("name of the component") ...
2
votes
1
answer
1k
views
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. ...
- 678
0
votes
0
answers
422
views
React server side rendering unable to import jsx files
I am using react server side rendering with node to generate pdf.
I have 3 files
index.js, PDF.jsx, helper.jsx
index.js contains following code.
let fileContent = await Fsp.readFile('PDF.jsx', '...
2
votes
0
answers
1k
views
React gives warning (Did not expect server HTML to contain a <div> in <div>) when using React.Suspense
I am building a react app with the SSR feature and I am using React.Suspense for code-splitting on the client-side and I am getting this warning.
Warning: Did not expect server HTML to contain a <...
- 678
6
votes
1
answer
935
views
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 ...
- 553
2
votes
0
answers
512
views
Need to 'gatsby clean' with essentially every code change
So, our team are working on a Gatsby website, and it's working correctly for most of us.
One developer, however, needs to run gatsby clean on essentially every single code change.
Doesn't matter if ...
- 1,607
0
votes
1
answer
511
views
React Loadable SSR - chunks are loading twice
I am adding js chunks in html using below tag
<script crossorigin defer type="text/javascript" src="<chunk>"></script>
at the end of body tag
The same chunk is being loaded again ...
- 360
0
votes
1
answer
272
views
How correctly suspend react routing process in SPA?
There is a website, the front is written by ReactJS. For the correct operation of the CEO, SSR is used.
The algorithm is like:
1 page load
the browser opens / foo;
SSR checks if is in the cache /foo ...
- 169
0
votes
1
answer
88
views
Server side rendering using reactjs
I have started to work on react server side rendering, Having some questions i.e how about routing and can i implement server side rendering for all pages in application,Please provide any example on ...
- 579
-3
votes
1
answer
275
views
Bump acorn from 6.4.0 to 6.4.1 #1
GitHub set a message for me, say: Bump acorn from 6.4.0 to 6.4.1 #1, and I merge, my project is ok?
my project is react-ssr demo, why send me this message?
- 19
3
votes
0
answers
1k
views
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 ...
- 1,617
1
vote
0
answers
713
views
React SSR app is not loading routed component in mid of API request
I'm creating a React SSR Project. I have achieved server-side rendering with Redux integrated.
However When I go through some component using api with bulk data, then while it's loading, hit the Back ...
- 1,542
1
vote
0
answers
1k
views
Adding Material UI to React SSR
I'm using this really awesome boilerplate for a React SSR app and am trying to add Material UI for css lib. I've gone through their guide for Server Side Rendering but seem to be doing something wrong ...
- 1,958
0
votes
0
answers
822
views
React lazy server side rendering
I want to do server-side rendering with code splitting and the works. I'm using componentDidMount() to load data to be displayed.
Before delving into ReactDOMServer, I would like to know how it would ...
- 3,810
4
votes
1
answer
2k
views
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 ...
- 1,973
1
vote
0
answers
562
views
Apolllo client-state preset cache does not work on server side render
I am trying to use Apollo client-state data with the hooks useQuery and useMutation as a global store inside a NextJS app.
When I follow the example from NextJS called with-apollo (https://github.com/...
- 300
3
votes
1
answer
4k
views
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. ...
- 3,876
3
votes
2
answers
12k
views
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-...
- 19.7k
2
votes
2
answers
9k
views
Error in react-toastify/dist/ReactToastify.css Module parse failed .Toastify__toast-container { | React SSR
i am getting error when i use Error in react-toastify npm module and server side rendering. toastify/dist/ReactToastify.css
Module parse failed: Unexpected token (1:0) You may need an appropriate ...
- 3,720
1
vote
0
answers
435
views
Laravel Spatie SSR Node Commands Not Working Always Displaying 'node' is not recognized as an internal or external command
Am trying ssr using laravel react js. While am using spatie ssr package for laravel. all configuration setup is done. but whenever i trying to run its throwing error
public function mustRun(...
- 19
2
votes
1
answer
406
views
DOM Attributes do not update in Gatsby
I am having a weird issue on the static file after run gatsby build.
DOM's attributes (like className) could not be updated by listening to the prop change, but not the case of DOM's content, like ...
- 1,160
2
votes
1
answer
2k
views
load server data on redux initial state on SSR app
I have created a website which is React+Redux Serverside Render app, for loading server data I am dispatching an action on componentWillMount but it is an asynchronous request which loading data from ...
- 994
0
votes
1
answer
610
views
Reactjs TypeError: Cannot read property 'toLowerCase' of undefined (react-router-config)
I'm using Reactjs for server-side rendering, using the react-router-config package for achieving ssr but after change React Router to react-router-config code. Application stopped working
The Error ...
0
votes
1
answer
347
views
I'm getting an about babel-preset-react not being found
However, as far as I know - I don't even have it installed. I believe I used to but I'm in the midst of updating this project to webpack4x and babel 7x. It was webpack 3x and babel 6x.
Here is my ...
- 1,958
0
votes
1
answer
2k
views
Webpack 4 node modules css - Syntax Error: Unexpected token .(dot)
I'm trying to change my react project client side rendering to server side rendering.
There has a problem when I use my webpack config on css which is well used in my origin project(client side ...
- 377
1
vote
0
answers
543
views
React SSR: Static files on client and server bundles
I'm working on a ssr React application where I was using only Webpack for creating the client bundle. But now I have to add static files like images or custom fonts so I have to create a Webpack ...
- 31
2
votes
0
answers
574
views
How to deploy app with firebase hosting without a index.html?
I don't have a index.html file, the app is React SSR, which built with just an index.js entry file. To start the server I do node index.js.
How do I deploy the app in firebase?
- 3,876
1
vote
0
answers
207
views
Server-side webpack not able to read css file from node_modules
I'm trying to create one component using react-responsive-carousel.
But getting below message when trying to build the code for Server side. For Client Side, MiniCssExtract loader is able to read ...
- 11
0
votes
1
answer
1k
views
React Loadable SSR isn't always giving client complete list of bundles, leading to page flash
I've been struggling for the last few days to eliminate page flash. My project started with create-react-app, then I used help to set up SSR and various other options. When I started running into ...
- 123
2
votes
0
answers
407
views
React SSR document is not defined
I'm nearly done updating an old React (v15.2x) with SSR (RRv2.3) and webpack 1x code base for a movie app. I've updated nearly everything to current stuff (except for RRv3.2x).
I'm getting this error
...
- 1,958
1
vote
1
answer
75
views
Webpack code-splitting bundles hosted over two servers
My React SSR app loads modules at runtime when it knows which are needed.
Webpack splits and bundles the code.
The SSR app is hosted on server A, and the bundles must, for reasons beyond my control, ...
- 11.3k
2
votes
0
answers
1k
views
$.extend is not a function with React SSR
I am facing an issue in react SSR.
Added two plugins which are as under
import 'fullcalendar';
import 'fullcalendar-scheduler';
FullCalander throwing an error in terminal which is stated below
...
- 155
1
vote
1
answer
247
views
Prevent browser from making the same async calls as the server
I am following this tutorial: https://crypt.codemancers.com/posts/2017-06-03-reactjs-server-side-rendering-with-router-v4-and-redux/ which i think is the 'standard' way of doing server side rendering ...
- 1,735