我正在查看Facebook的React的源代码,并看到在整个项目源中,他们没有指定加载自己的模块的相对路径.例如,库不使用var foo = require(‘../ bar / foobar’),而是使用var foo = require(‘foobar’),就好像模块已经在node_modules中加载,以便CommonJS读取.
我只是想知道他们是如何做到这一点的?我尝试通过Grunt查看他们的构建步骤,但看不到任何直接完成此任务的软件包.
对于我正在讨论的技术的更具体的例子,here库调用了flattenChildren模块,该模块存在于different directory altogether中而没有指定路径.
解决方法
React使用一个名为
commoner的工具.它们的配置匹配如下所示的行:
* @providesModule ReactChildReconciler
要求(‘ReactChildReconciler’)调用.他们还将所有内容放在一个目录中,因此路径最终为require(‘./ ReactChildReconciler’).
源代码以结构化的方式组织,但模块名称对于repo是全球唯一的(我认为所有facebook的内部代码都是如此)
[引证需要]).这意味着它所指出的内容并不含糊.
通过在第一个节点之后移除参数来节省空间,对生成构建转换对不变量(断言,解释,…)和类似警告调用的调用.警告调用完全被剥离,因为它们被包裹在下一个魔法中:仅开发块.
if (__DEV__) { ... }
编译为:
if (process.env.NODE_ENV !== 'production') { ... }
其中,通过envify,编译(在开发中),代码运行:
if ('development' !== 'production') { ... }
这在生产中:
if ('production' !== 'production') { ... }
哪个缩小到这个: