Search code examples
javascriptreact-nativebundler

understanding _$$_REQUIRE in bundled react native javascript file


I am trying to understand what is going on in a bundled javascript file from an react native app. It seem the bundler creates for every js file a function like in the code below. Here, it seems that fetch.js imports a definition for fetch from whatwg-fetch and exports it again.

I wonder how the _$$_REQUIRE functions works here. Somehow it will load all definitions for fetch, Headers, Request Response into scope such that the export can actually export them. Are these symbols attached to the global scope? Or are they somehow loaded into local scope? I don't find the definition for the REQUIRE function either. How does this function work?

__d(function (global, _$$_REQUIRE, _$$_IMPORT_DEFAULT, _$$_IMPORT_ALL, module, exports, _dependencyMap) {
  'use strict';

  _$$_REQUIRE(_dependencyMap[0], "whatwg-fetch");

  module.exports = {
    fetch: fetch,
    Headers: Headers,
    Request: Request,
    Response: Response
  };
},115,[116],"node_modules/react-native/Libraries/Network/fetch.js");

Solution

  • Turns out whatwg-fetch is a so called polyfill which provides some implementation for fetch in case non is provided yet. The require function is the result of the transpiler (bable) and bundler (metro) from originally an simple import statement without specifying what exactly to import so it will only run code and change the global state. The export will then export the global variable fetch.