Mit Webpack versuche ich, isEqual zu importieren, da lodash
anscheinend alles importiert wird. Ich habe Folgendes ohne Erfolg versucht:
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'
javascript
lodash
adang3
quelle
quelle
Antworten:
Sie können
lodash.isequal
als einzelnes Modul installieren, ohne das gesamte lodash- Paket wie folgt zu installieren :Wenn Sie die Module ECMAScript 5 und CommonJS verwenden, importieren Sie sie wie folgt:
Bei Verwendung von ES6-Modulen wäre dies:
Und Sie können es in Ihrem Code verwenden:
Quelle: Lodash-Dokumentation
Nach dem Import können Sie die
isEqual
Funktion in Ihrem Code verwenden. Beachten Sie, dass es kein Teil eines Objekts mit dem Namen ist,_
wenn Sie es auf diese Weise importieren. Sie verweisen also nicht mit_.isEqual
, sondern direkt mitisEqual
.Alternative: Verwenden
lodash-es
Wie von @kimamula hervorgehoben :
Mit Webpack 4 und lodash-es 4.17.7 und höher funktioniert dieser Code.
Dies liegt daran, dass Webpack 4 das sideEffects- Flag unterstützt und
lodash-es
4.17.7 und höher das Flag enthält (das auf gesetzt istfalse
).Warum nicht die Version mit dem Schrägstrich verwenden? Andere Antworten auf diese Frage legen nahe, dass Sie anstelle eines Punkts auch einen Bindestrich verwenden können:
Dies funktioniert auch, aber es gibt zwei kleinere Nachteile:
npm install --save lodash
) installieren , nicht nur das kleine separate lodash.isequal- Paket. Der Speicherplatz ist billig und die CPUs sind schnell, sodass Sie sich möglicherweise nicht darum kümmernisEqual
durchschnittlich 28% größer sind (ausprobiertes Webpack 2 und Webpack 3, mit oder ohne Babel, mit oder ohne Uglify)quelle
_ is not defined
_.isEquals
_.isEqual
, sollten Sie direkt verwendenisEqual
npm --save lodash.whatever
jede Funktion einzeln auszuführen, entfällt , aber die größere Bündelgröße könnte es sicherlich lohnenswert machen, die Periodenmethode zu verwenden. Ich bin überrascht, dass es einen Unterschied gibt, und ich bin froh, dass Sie die Zahlen für uns angegeben haben.Wenn Sie nur
isEqual
die restlichenlodash
Funktionen einbeziehen möchten und nicht (nützlich, um die Größe Ihres Bundles klein zu halten), können Sie dies in ES6 tun.Dies ist so ziemlich das Gleiche wie in der
lodash
README-Datei beschrieben , außer dass dort dierequire()
Syntax verwendet wird.quelle
Mit Webpack 4 und lodash-es 4.17.7 und höher funktioniert dieser Code.
Dies liegt daran, dass Webpack 4
sideEffects
Flag und Lodash-es 4.17.7 und höher unterstützt und das Flag enthält (das auf gesetzt istfalse
).Bearbeiten
Ab Version 1.9.0 unterstützt Parcel auch
"sideEffects": false
, daherimport { isEqual } from 'lodash-es';
kann mit Parcel auch ein Baum geschüttelt werden.quelle
Nicht mit Webpack verwandt, aber ich werde es hier hinzufügen, da viele Leute derzeit auf Typoskript umsteigen.
Sie können auch eine einzelne Funktion aus lodash importieren, indem Sie
import isEqual from 'lodash/isEqual';
in Typoskript dasesModuleInterop
Flag in den Compileroptionen (tsconfig.json) verwenden.Beispiel
quelle
Lodash listet in seiner README- Datei einige Optionen auf :
babel-plugin-lodash
.babelrc
Grob dazu:
lodash-webpack-plugin
webpack.config.js
:lodash-es mit dem lodash cli
$ lodash modularize exports=es -o ./
quelle
das hat tatsächlich bei mir funktioniert
quelle
import { isEqual } from 'lodash-es';
importiert die gesamte Bibliothek. Ich verwende Rollup, das standardmäßig Baumschütteln durchführen soll.Immer wenn ich meine eigenen Module geschrieben habe, funktioniert diese benannte Importsyntax und Rollup erfolgreich Tree Shakes, daher bin ich etwas verwirrt darüber, warum es mit Lodash nicht funktioniert.
quelle