The react-web parser receives a JSX Node. Then it builds into a JavaScript bundle by using esbuild JavaScript APIs and finally returns the output from the ESbuild pipeline into VFiles (?) (This is an open topic, as the build will probably return a bunch of different outputs which are probably the numerous chunks if we use chunk loading of the build);
The react-web generator aims to receive a top-level JSX element, wrap it with ReactDOM, build it as an ES2017 (or newer) target output, and return the parsed/built content to be stored in files.
Also, the react-web will receive the final contents of the generated pipeline. The output is pretty much JavaScript, which can then be used/added elsewhere.
I'm not sure if we should use esbuild or how to deal with the Web part of the bundling/generation of the API docs because:
The mdx-react generator handles individual doc files
Somewhere between mdx-react and react-web we need to handle building the rest of the website (such as navigation, footer, header, etc)
I had an idea that it could look like:
import loadDocFile from './loader.mjs';
import parseDocFile from './parser.mjs';
import getNodeRease from './release.mjs';
import mdxGenerator from './generators/mdx';
import mdxReactGenerator from './generators/mdx-react';
import webGenerator from './generators/react-web';
// Returns an array of Promises of VFile's
const promises = docFiles.map(fileName =>
loadDocFile(fileName )
.then(parseDocFile)
.then(mdxGenerator)
.then(mdxReactGenerator)
);
// Web Generator takes an array of VFiles
// And then generates the navigation, header, footer, and each page?
const javaScriptBundle = await webGenerator(vFiles, release);
// Do something with the bundle ??
// Save them on chunk files on the out directory ??
Would you please do something?
- Note that the example above is just an example entry point, since we provide a generic API, users can use the CLI entry point which by default outputs to FILES in the given output directory; we can also have the DevServer entry Point with Vite (?) which requires the build to happen first or something...
I'd like input on this cc @nodejs/web-infra as this is the most complex part for outputting to Web
The
react-webgenerator depends upon the https://github.com/nodejs/api-docs-tooling/issues/6 generator.The
react-webparser receives a JSX Node. Then it builds into a JavaScript bundle by usingesbuildJavaScript APIs and finally returns the output from the ESbuild pipeline into VFiles (?) (This is an open topic, as the build will probably return a bunch of different outputs which are probably the numerous chunks if we use chunk loading of the build);The
react-webgenerator aims to receive a top-level JSX element, wrap it with ReactDOM, build it as an ES2017 (or newer) target output, and return the parsed/built content to be stored in files.Also, the
react-webwill receive the final contents of the generated pipeline. The output is pretty much JavaScript, which can then be used/added elsewhere.I'm not sure if we should use esbuild or how to deal with the Web part of the bundling/generation of the API docs because:
mdx-reactgenerator handles individual doc filesSomewhere between
mdx-reactandreact-webwe need to handle building the rest of the website (such as navigation, footer, header, etc)// Returns an array of Promises of VFile's const promises = docFiles.map(fileName => loadDocFile(fileName ) .then(parseDocFile) .then(mdxGenerator) .then(mdxReactGenerator) );
const vFiles = await Promise.all(promises); const release = await getNodeRease('22.0');
// Web Generator takes an array of VFiles // And then generates the navigation, header, footer, and each page? const javaScriptBundle = await webGenerator(vFiles, release);
// Do something with the bundle ?? // Save them on chunk files on the out directory ?? Would you please do something?
I'd like input on this cc @nodejs/web-infra as this is the most complex part for outputting to Web