导入 lodash 的正确方法

javascript lodash babeljs

2022-08-30 00:38:56

我在下面有一个拉取请求反馈，只是想知道哪种方式是导入lodash的正确方法？

你最好从'lodash/has'导入。对于早期版本的 lodash （v3），它本身就很重，我们应该只导入一个特定的模块/函数，而不是导入整个 lodash 库。不确定较新版本（v4）。

import has from 'lodash/has';

与

import { has } from 'lodash';

谢谢

答案 1

import has from 'lodash/has';更好，因为 lodash 在单个文件中保存了所有函数，因此与其以 100k 的速度导入整个 'lodash' 库，不如只导入 lodash 的函数，这可能是 2k。has

答案 2

如果您使用的是，下面的代码是树可振荡的。webpack 4

import { has } from 'lodash-es';

需要注意的要点;

CommonJS模块不是树可振荡的，所以你绝对应该使用lodash-es，这是作为ES模块导出的Lodash库，而不是lodash（CommonJS）。
lodash-es的 package.json 包含，它通知 webpack 4 包内的所有文件都没有副作用（请参阅 https://webpack.js.org/guides/tree-shaking/#mark-the-file-as-side-effect-free）。"sideEffects": false
此信息对于树抖至关重要，因为模块捆绑程序不会树摇动可能包含副作用的文件，即使其导出的成员未在任何地方使用也是如此。

编辑

从版本1.9.0开始，Parcel还支持“sideEffects”：false，因此也是Mail的树可摇动。它还支持树摇动CommonJS模块，尽管根据我的实验，ES模块的树摇可能比CommonJS更有效。import { has } from 'lodash-es';