mirror of
https://github.com/zebrajr/react.git
synced 2025-12-06 12:20:20 +01:00
Fix for SSR2 fixture not working locally (#24237)
* SS2 fixture not working locally fix * Fix prettier issue * prettier excess line fix * Update render.js * Update README.md Co-authored-by: dan <dan.abramov@gmail.com>
This commit is contained in:
parent
4db3ff6c1a
commit
d352fd0931
30
fixtures/ssr2/README.md
Normal file
30
fixtures/ssr2/README.md
Normal file
|
|
@ -0,0 +1,30 @@
|
||||||
|
# SSR Fixtures
|
||||||
|
|
||||||
|
A set of test cases for quickly identifying issues with server-side rendering.
|
||||||
|
|
||||||
|
## Setup
|
||||||
|
|
||||||
|
To reference a local build of React, first run `npm run build` at the root
|
||||||
|
of the React project. Then:
|
||||||
|
|
||||||
|
```
|
||||||
|
cd fixtures/ssr2
|
||||||
|
yarn
|
||||||
|
yarn start
|
||||||
|
```
|
||||||
|
|
||||||
|
The `start` command runs a webpack dev server and a server-side rendering server in development mode with hot reloading.
|
||||||
|
|
||||||
|
**Note: whenever you make changes to React and rebuild it, you need to re-run `yarn` in this folder:**
|
||||||
|
|
||||||
|
```
|
||||||
|
yarn
|
||||||
|
```
|
||||||
|
|
||||||
|
If you want to try the production mode instead run:
|
||||||
|
|
||||||
|
```
|
||||||
|
yarn start:prod
|
||||||
|
```
|
||||||
|
|
||||||
|
This will pre-build all static resources and then start a server-side rendering HTTP server that hosts the React app and service the static resources (without hot reloading).
|
||||||
|
|
@ -40,7 +40,6 @@ webpack(
|
||||||
console.error(err.details);
|
console.error(err.details);
|
||||||
}
|
}
|
||||||
process.exit(1);
|
process.exit(1);
|
||||||
return;
|
|
||||||
}
|
}
|
||||||
const info = stats.toJson();
|
const info = stats.toJson();
|
||||||
if (stats.hasErrors()) {
|
if (stats.hasErrors()) {
|
||||||
|
|
|
||||||
|
|
@ -20,6 +20,7 @@ let assets = {
|
||||||
};
|
};
|
||||||
|
|
||||||
module.exports = function render(url, res) {
|
module.exports = function render(url, res) {
|
||||||
|
const data = createServerData();
|
||||||
// This is how you would wire it up previously:
|
// This is how you would wire it up previously:
|
||||||
//
|
//
|
||||||
// res.send(
|
// res.send(
|
||||||
|
|
@ -36,14 +37,17 @@ module.exports = function render(url, res) {
|
||||||
console.error('Fatal', error);
|
console.error('Fatal', error);
|
||||||
});
|
});
|
||||||
let didError = false;
|
let didError = false;
|
||||||
const data = createServerData();
|
|
||||||
const {pipe, abort} = renderToPipeableStream(
|
const {pipe, abort} = renderToPipeableStream(
|
||||||
<DataProvider data={data}>
|
<DataProvider data={data}>
|
||||||
<App assets={assets} />
|
<App assets={assets} />
|
||||||
</DataProvider>,
|
</DataProvider>,
|
||||||
{
|
{
|
||||||
bootstrapScripts: [assets['main.js']],
|
bootstrapScripts: [assets['main.js']],
|
||||||
onCompleteShell() {
|
onAllReady() {
|
||||||
|
// Full completion.
|
||||||
|
// You can use this for SSG or crawlers.
|
||||||
|
},
|
||||||
|
onShellReady() {
|
||||||
// If something errored before we started streaming, we set the error code appropriately.
|
// If something errored before we started streaming, we set the error code appropriately.
|
||||||
res.statusCode = didError ? 500 : 200;
|
res.statusCode = didError ? 500 : 200;
|
||||||
res.setHeader('Content-type', 'text/html');
|
res.setHeader('Content-type', 'text/html');
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue
Block a user