mirror of
https://github.com/facebook/docusaurus.git
synced 2025-06-06 04:42:40 +02:00
fix(core): avoid using logger and fs.readJSON in SSR (#7453)
* fix(core): avoid using logger and fs.readJSON in SSR * ignore prettier
This commit is contained in:
parent
5aaa33fc61
commit
0f8f918f2c
2 changed files with 19 additions and 7 deletions
|
@ -56,6 +56,7 @@
|
||||||
"babel-loader": "^8.2.5",
|
"babel-loader": "^8.2.5",
|
||||||
"babel-plugin-dynamic-import-node": "2.3.0",
|
"babel-plugin-dynamic-import-node": "2.3.0",
|
||||||
"boxen": "^6.2.1",
|
"boxen": "^6.2.1",
|
||||||
|
"chalk": "^4.1.2",
|
||||||
"chokidar": "^3.5.3",
|
"chokidar": "^3.5.3",
|
||||||
"clean-css": "^5.3.0",
|
"clean-css": "^5.3.0",
|
||||||
"cli-table3": "^0.6.2",
|
"cli-table3": "^0.6.2",
|
||||||
|
|
|
@ -10,7 +10,7 @@ import path from 'path';
|
||||||
import fs from 'fs-extra';
|
import fs from 'fs-extra';
|
||||||
// eslint-disable-next-line no-restricted-imports
|
// eslint-disable-next-line no-restricted-imports
|
||||||
import _ from 'lodash';
|
import _ from 'lodash';
|
||||||
import logger from '@docusaurus/logger';
|
import chalk from 'chalk';
|
||||||
import * as eta from 'eta';
|
import * as eta from 'eta';
|
||||||
import {StaticRouter} from 'react-router-dom';
|
import {StaticRouter} from 'react-router-dom';
|
||||||
import ReactDOMServer from 'react-dom/server';
|
import ReactDOMServer from 'react-dom/server';
|
||||||
|
@ -43,15 +43,20 @@ export default async function render(
|
||||||
try {
|
try {
|
||||||
return await doRender(locals);
|
return await doRender(locals);
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
logger.error`Docusaurus server-side rendering could not render static page with path path=${locals.path}.`;
|
// We are not using logger in this file, because it seems to fail with some
|
||||||
|
// compilers / some polyfill methods. This is very likely a bug, but in the
|
||||||
|
// long term, when we output native ES modules in SSR, the bug will be gone.
|
||||||
|
// prettier-ignore
|
||||||
|
console.error(chalk.red(`${chalk.bold('[ERROR]')} Docusaurus server-side rendering could not render static page with path ${chalk.cyan.underline(locals.path)}.`));
|
||||||
|
|
||||||
const isNotDefinedErrorRegex =
|
const isNotDefinedErrorRegex =
|
||||||
/(?:window|document|localStorage|navigator|alert|location|buffer|self) is not defined/i;
|
/(?:window|document|localStorage|navigator|alert|location|buffer|self) is not defined/i;
|
||||||
|
|
||||||
if (isNotDefinedErrorRegex.test((err as Error).message)) {
|
if (isNotDefinedErrorRegex.test((err as Error).message)) {
|
||||||
logger.info`It looks like you are using code that should run on the client-side only.
|
// prettier-ignore
|
||||||
To get around it, try using code=${'<BrowserOnly>'} (url=${'https://docusaurus.io/docs/docusaurus-core/#browseronly'}) or code=${'ExecutionEnvironment'} (url=${'https://docusaurus.io/docs/docusaurus-core/#executionenvironment'}).
|
console.info(`${chalk.cyan.bold('[INFO]')} It looks like you are using code that should run on the client-side only.
|
||||||
It might also require to wrap your client code in code=${'useEffect'} hook and/or import a third-party library dynamically (if any).`;
|
To get around it, try using ${chalk.cyan('`<BrowserOnly>`')} (${chalk.cyan.underline('https://docusaurus.io/docs/docusaurus-core/#browseronly')}) or ${chalk.cyan('`ExecutionEnvironment`')} (${chalk.cyan.underline('https://docusaurus.io/docs/docusaurus-core/#executionenvironment')}).
|
||||||
|
It might also require to wrap your client code in ${chalk.cyan('`useEffect`')} hook and/or import a third-party library dynamically (if any).`);
|
||||||
}
|
}
|
||||||
|
|
||||||
throw err;
|
throw err;
|
||||||
|
@ -107,7 +112,12 @@ async function doRender(locals: Locals & {path: string}) {
|
||||||
|
|
||||||
const {generatedFilesDir} = locals;
|
const {generatedFilesDir} = locals;
|
||||||
const manifestPath = path.join(generatedFilesDir, 'client-manifest.json');
|
const manifestPath = path.join(generatedFilesDir, 'client-manifest.json');
|
||||||
const manifest: Manifest = await fs.readJSON(manifestPath);
|
// Using readJSON seems to fail for users of some plugins, possibly because of
|
||||||
|
// the eval sandbox having a different `Buffer` instance (native one instead
|
||||||
|
// of polyfilled one)
|
||||||
|
const manifest: Manifest = await fs
|
||||||
|
.readFile(manifestPath, 'utf-8')
|
||||||
|
.then(JSON.parse);
|
||||||
|
|
||||||
// Get all required assets for this particular page based on client
|
// Get all required assets for this particular page based on client
|
||||||
// manifest information.
|
// manifest information.
|
||||||
|
@ -143,7 +153,8 @@ async function doRender(locals: Locals & {path: string}) {
|
||||||
minifyJS: true,
|
minifyJS: true,
|
||||||
});
|
});
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
logger.error`Minification of page path=${locals.path} failed.`;
|
// prettier-ignore
|
||||||
|
console.error(chalk.red(`${chalk.bold('[ERROR]')} Minification of page ${chalk.cyan.underline(locals.path)} failed.`));
|
||||||
throw err;
|
throw err;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue