javascript - 如何导入单个 Lodash 函数？

Question

使用 webpack，我正在尝试导入 isEqual因为 lodash 似乎正在导入所有内容。我尝试执行以下操作但没有成功:

import { isEqual } from 'lodash'

import isEqual from 'lodash/lang'

import isEqual from 'lodash/lang/isEqual'

import { isEqual } from 'lodash/lang'

import { isEqual } from 'lodash/lang'

Answer 1

您可以将 lodash.isequal 安装为单个模块，而无需像这样安装整个 lodash 包:

npm install --save lodash.isequal

当使用 ECMAScript 5 和 CommonJS 模块时，您可以像这样导入它:

var isEqual = require('lodash.isequal');

使用 ES6 模块，这将是:

import isEqual from 'lodash.isequal';

您可以在您的代码中使用它:

const obj1 = {username: 'peter'};
const obj2 = {username: 'peter'};
const obj3 = {username: 'gregory'};

isEqual(obj1, obj2) // returns true
isEqual(obj1, obj3) // returns false

来源:Lodash documentation

导入后，您可以在代码中使用isEqual 函数。请注意，如果您以这种方式导入它，它不是名为 _ 的对象的一部分，因此您不要用_.isEqual 引用它，而是直接用isEqual 引用它。

备选方案:使用 lodash-es

正如 @kimamula 指出的那样:

使用 webpack 4 和 lodash-es 4.17.7 及更高版本，此代码有效。

import { isEqual } from 'lodash-es';

这是因为 webpack 4 支持 sideEffects标志和 lodash-es 4.17.7 及更高版本包括标志(设置为 false)。

为什么不使用带斜杠的版本？这个问题的其他答案建议您也可以使用破折号而不是点，如下所示:

import isEqual from 'lodash/isequal';

这也行，但有两个小缺点:

• 您必须安装整个 lodash 包(npm install --save lodash)，而不仅仅是单独的小 lodash.isequal 包;存储空间便宜，CPU 速度快，所以你可能不关心这个
• 使用 webpack 等工具生成的包会稍大一些；我发现使用 isEqual 的最小代码示例的包大小平均大 28%(尝试过 webpack 2 和 webpack 3，有或没有 Babel，有或没有 Uglify)