module() — react Function Reference

Architecture documentation for the module() function in external-runtime-plugin.js from the react codebase.

Function javascript BabelCompiler Entrypoint

Entity Profile

BabelCompiler→ Entrypoint→ module() — react Function Reference

Dependency Diagram

graph TD
  593481f7_eb8b_9c34_7a83_4075ec206a7f["module()"]
  188dc72e_eaf1_80f2_0c2b_11c51e453345["external-runtime-plugin.js"]
  593481f7_eb8b_9c34_7a83_4075ec206a7f -->|defined in| 188dc72e_eaf1_80f2_0c2b_11c51e453345
  style 593481f7_eb8b_9c34_7a83_4075ec206a7f fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

scripts/rollup/plugins/external-runtime-plugin.js lines 9–46

module.exports = function externalRuntime() {
  // When generating the source code for the Fizz runtime chunks we use global identifiers to refer
  // to different parts of the implementation. When generating the external runtime we need to
  // replace those with local identifiers instead.
  return {
    name: 'scripts/rollup/plugins/dynamic-imports',
    renderChunk(source) {
      // This replaces "window['$globalVar']" with "$globalVar".
      const variables = new Set();
      source = source.replace(
        /window\[['"](\$[A-z0-9_]*)['"]\]/g,
        (_, variableName) => {
          variables.add(variableName);
          return variableName;
        }
      );
      const startOfFn = 'use strict';
      let index = source.indexOf(startOfFn);
      if (index === -1) {
        return source;
      }
      index += startOfFn.length + 2;

      // Insert the declarations in the beginning of the function closure
      // to scope them to inside the runtime.
      let declarations = 'let ';
      variables.forEach(variable => {
        if (declarations !== 'let ') {
          declarations += ', ';
        }
        declarations += variable;
      });
      declarations += ';';
      source = source.slice(0, index) + declarations + source.slice(index);
      return source;
    },
  };
};