[解決済み] Lodashの関数を1つだけインポートするには？

質問

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'

解決方法は？

をインストールすることができます。 lodash.isequal をインストールすることなく、単一のモジュールとして ロダッシュ というようにパッケージ化されています。

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のドキュメント

インポートした後は isEqual 関数をコードに組み込むことができます。という名前のオブジェクトの一部でないことに注意してください。 _ この方法でインポートした場合 はしない。 で参照します。 _.isEqual でなく、直接 isEqual .

代替案 使用方法 lodash-es

のご指摘の通りです。 キマムラ :

webpack4と ロダッシュエス 4.17.7以降では、このコードは動作します。

import { isEqual } from 'lodash-es';

これは、webpack 4 が sideEffects フラグと lodash-es 4.17.7 以降では、フラグ（このフラグは false ).

なぜスラッシュ付きのバージョンを使用しないのか？ この質問に対する他の回答では、このようにドットの代わりにダッシュを使うこともできるようです。

import isEqual from 'lodash/isequal';

これもうまくいくのですが、2つほど小さな欠点があります。

• をすべてインストールする必要があります。 ロダッシュ パッケージ ( npm install --save lodash ) だけでなく、小さな独立した lodash.isequal ストレージスペースは安く、CPUは速いので、これは気にしないかもしれません。
• webpackなどのツールを使用した場合のバンドルは、若干大きくなります。 isEqual は平均して 28% 大きくなります (webpack 2 と webpack 3、Babel の有無、Uglify の有無を試しました)。