main() — react Function Reference

Architecture documentation for the main() function in generate-inline-fizz-runtime.js from the react codebase.

Function javascript BabelCompiler Entrypoint

Entity Profile

BabelCompiler→ Entrypoint→ main() — react Function Reference

Dependency Diagram

graph TD
  281dd36e_d6a2_e62c_600e_ac42c98e9e68["main()"]
  d0d56d32_f674_98a1_0ee1_f716d69ce1c2["generate-inline-fizz-runtime.js"]
  281dd36e_d6a2_e62c_600e_ac42c98e9e68 -->|defined in| d0d56d32_f674_98a1_0ee1_f716d69ce1c2
  style 281dd36e_d6a2_e62c_600e_ac42c98e9e68 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

scripts/rollup/generate-inline-fizz-runtime.js lines 48–101

async function main() {
  const exportStatements = await Promise.all(
    config.map(async ({entry, exportName}) => {
      const fullEntryPath = instructionDir + '/' + entry;
      const compiler = new ClosureCompiler({
        entry_point: fullEntryPath,
        js: [
          require.resolve('./externs/closure-externs.js'),
          fullEntryPath,
          instructionDir + '/ReactDOMFizzInstructionSetShared.js',
        ],
        compilation_level: 'ADVANCED',
        language_in: 'ECMASCRIPT_2020',
        language_out: 'ECMASCRIPT5_STRICT',
        module_resolution: 'NODE',
        // This is necessary to prevent Closure from inlining a Promise polyfill
        rewrite_polyfills: false,
      });

      const code = await new Promise((resolve, reject) => {
        compiler.run((exitCode, stdOut, stdErr) => {
          if (exitCode !== 0) {
            reject(new Error(stdErr));
          } else {
            resolve(stdOut);
          }
        });
      });

      return `export const ${exportName} = ${JSON.stringify(code.trim().replace('\n', ''))};`;
    })
  );

  let outputCode = [
    '// This is a generated file. The source files are in react-dom-bindings/src/server/fizz-instruction-set.',
    '// The build script is at scripts/rollup/generate-inline-fizz-runtime.js.',
    '// Run `yarn generate-inline-fizz-runtime` to generate.',
    ...exportStatements,
  ].join('\n');

  // This replaces "window.$globalVar" with "$globalVar". There's probably a
  // better way to do this with Closure, with externs or something, but I
  // couldn't figure it out. Good enough for now. This only affects the inline
  // Fizz runtime, and should break immediately if there were a mistake, so I'm
  // not too worried about it.
  outputCode = outputCode.replace(
    /window\.(\$[A-z0-9_]*|matchMedia)/g,
    (_, variableName) => variableName
  );

  const prettyOutputCode = await prettier.format(outputCode, prettierConfig);

  fs.writeFileSync(inlineCodeStringsFilename, prettyOutputCode, 'utf8');
}