compile() — react Function Reference

Architecture documentation for the compile() function in runner-worker.ts from the react codebase.

Function typescript BabelCompiler Optimization calls 2 called by 1

Entity Profile

BabelCompiler→ Optimization→ compile() — react Function Reference

Dependency Diagram

graph TD
  7b109a5c_c041_536b_2f9e_eb9ea6d3da19["compile()"]
  49c99dfe_ec8f_3cb7_769b_a3b735b82b82["runner-worker.ts"]
  7b109a5c_c041_536b_2f9e_eb9ea6d3da19 -->|defined in| 49c99dfe_ec8f_3cb7_769b_a3b735b82b82
  5e39198b_b086_5261_de7a_7fc49349ecb6["transformFixture()"]
  5e39198b_b086_5261_de7a_7fc49349ecb6 -->|calls| 7b109a5c_c041_536b_2f9e_eb9ea6d3da19
  832758c3_1f10_c8e6_0d0e_612147777ee2["clearRequireCache()"]
  7b109a5c_c041_536b_2f9e_eb9ea6d3da19 -->|calls| 832758c3_1f10_c8e6_0d0e_612147777ee2
  34f68e46_4ab8_f2b5_b44f_59f14d4d25b8["transformFixtureInput()"]
  7b109a5c_c041_536b_2f9e_eb9ea6d3da19 -->|calls| 34f68e46_4ab8_f2b5_b44f_59f14d4d25b8
  style 7b109a5c_c041_536b_2f9e_eb9ea6d3da19 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

compiler/packages/snap/src/runner-worker.ts lines 45–163

async function compile(
  input: string,
  fixturePath: string,
  compilerVersion: number,
  shouldLog: boolean,
  includeEvaluator: boolean,
): Promise<{
  error: string | null;
  compileResult: TransformResult | null;
}> {
  const seenConsoleErrors: Array<string> = [];
  console.error = (...messages: Array<string>) => {
    seenConsoleErrors.push(...messages);
  };
  if (version !== null && compilerVersion !== version) {
    clearRequireCache();
  }
  version = compilerVersion;

  let compileResult: TransformResult | null = null;
  let error: string | null = null;
  try {
    const importedCompilerPlugin = require(BABEL_PLUGIN_SRC) as Record<
      string,
      unknown
    >;

    // NOTE: we intentionally require lazily here so that we can clear the require cache
    // and load fresh versions of the compiler when `compilerVersion` changes.
    const BabelPluginReactCompiler = importedCompilerPlugin[
      'default'
    ] as PluginObj;
    const EffectEnum = importedCompilerPlugin['Effect'] as typeof Effect;
    const ValueKindEnum = importedCompilerPlugin[
      'ValueKind'
    ] as typeof ValueKind;
    const ValueReasonEnum = importedCompilerPlugin[
      'ValueReason'
    ] as typeof ValueReason;
    const printFunctionWithOutlined = importedCompilerPlugin[
      PRINT_HIR_IMPORT
    ] as typeof PrintFunctionWithOutlined;
    const printReactiveFunctionWithOutlined = importedCompilerPlugin[
      PRINT_REACTIVE_IR_IMPORT
    ] as typeof PrintReactiveFunctionWithOutlined;
    const parseConfigPragmaForTests = importedCompilerPlugin[
      PARSE_CONFIG_PRAGMA_IMPORT
    ] as typeof ParseConfigPragma;

    let lastLogged: string | null = null;
    const debugIRLogger = shouldLog
      ? (value: CompilerPipelineValue) => {
          let printed: string;
          switch (value.kind) {
            case 'hir':
              printed = printFunctionWithOutlined(value.value);
              break;
            case 'reactive':
              printed = printReactiveFunctionWithOutlined(value.value);
              break;
            case 'debug':
              printed = value.value;
              break;
            case 'ast':
              // skip printing ast as we already write fixture output JS
              printed = '(ast)';
              break;
          }

          if (printed !== lastLogged) {
            lastLogged = printed;
            console.log(`${chalk.green(value.name)}:\n ${printed}\n`);
          } else {
            console.log(`${chalk.blue(value.name)}: (no change)\n`);
          }
        }
      : () => {};

    // only try logging if we filtered out all but one fixture,
    // since console log order is non-deterministic
    const result = await transformFixtureInput(