How does the React library require its source libraries directly? How does the React library require its source libraries directly? reactjs reactjs

How does the React library require its source libraries directly?


React uses a tool called commoner. Their configuration of it matches up the lines that look like this:

* @providesModule ReactChildReconciler

To require('ReactChildReconciler') calls. They also put everything in a single directory, so the paths end up as require('./ReactChildReconciler').

The source code is organized in a structured way, but the module names are globally unique to the repo (and all of facebook's internal code, I think [citation needed]). This means there's no ambiguity in what it points to.


On the subject, there are also some other magical things in react's code.

The calls to invariant(assertion, explanation, ...) and the similar warning calls are transformed for the production build by removing the arguments after the first one to save space. Warning calls are stripped entirely, because they're wrapped in the next piece of magic: development only blocks.

if (__DEV__) {   ...}

Which compiles to:

if (process.env.NODE_ENV !== 'production') {   ...}

Which, via envify, compiles to this (in development), and the code runs:

if ('development' !== 'production') {   ...}

And this in production:

if ('production' !== 'production') {   ...}

Which minifies to this: