react-native的捆绑器是否可以通过树摇动进行优化?

时间:2017-10-26 08:59:23

标签: react-native webpack tree-shaking

我最近在模块中看到了关于深度要求的建议 -

  

注意:如果您不想要基于ReactART的组件及其依赖项,请执行深度要求:从'react-native-progress / Bar'导入ProgressBar;。

根据我的知识 - 没有添加/配置Webpack 2与树摇动并自行启用uglify - RN捆绑器不会树摇动并移除未使用的模块。

鉴于此,如果建议深度要求真的会导致未使用的依赖关系未被包含在最终捆绑中吗?

1 个答案:

答案 0 :(得分:2)

React-Native捆绑软件称为Metro,(在撰写本文时)称为there is an open issue fore tree shaking,交付时间为“ H1 2019”。

请注意,Uglify.js(或仅作用于单个文件的任何其他文件)均无法进行树状摇动,因为树状摇动(按定义)是模块之间的-等同于单个模块内的树状摇动称为“消除死代码”。因此,您需要在捆绑器级别进行适当的摇树。

要在OP中回答最后一个问题:是的,如果进行深层包含,则将排除未使用的依赖项。进行导入时,您正在创建对特定JavaScript文件(以及可传递地依赖于该文件的文件)的依赖关系。即使仅使用模块名称(例如:import "react-native-progress")的简写形式进行导入,也仅导入单个JavaScript文件:在这种情况下,您正在创建的单个文件依赖于名为在main字段下的package.json中(参见:browser字段)。

通常,该主文件只是简单地重新导出(即,依赖并公开)其他模块。 That is exactly what index.js does in react-native-progress,这就是为什么您在执行通用模块导入时最终导入软件包的所有模块。当您执行所谓的“深度需求”时,您只是绕过了index.js所做的重新导出,而是自己建立了对更深层模块的依赖。