webpackを使って、lodash
がすべてをインポートしているようなので、isEqualをインポートしようとしています。以下のようにしてみましたが、成功しませんでした。
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_パッケージ全体をインストールしなくても、lodash.isequal
を1つのモジュールとしてインストールすることができます。
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`を使用する
kimamula]1さんのご指摘の通りです。
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';
これも有効ですが、2つの小さな欠点があります。
npm install -save lodash
); ストレージスペースは安く、CPUは速いので、この点は気にしないかもしれません。isEqual
の最小限のコード例でのバンドルサイズは、平均して 28% 大きくなることがわかりました (webpack 2 と webpack 3、Babel の有無、Uglify の有無を試しました)もし、isEqual
だけをインクルードして、残りのlodash
関数をインクルードしたくない場合(バンドルサイズを小さくするのに便利)、ES6でこれを行うことができます。
import isEqual from 'lodash/isEqual'
これは、the lodash
READMEで説明されていることとほとんど同じですが、そこでは require()
構文が使われています。
var at = require('lodash/at');