Правильный способ импорта lodash

У меня была обратная связь с запросом на тягу ниже, просто интересно, какой путь является правильным способом импорта lodash?

Вам лучше делать импорт из 'lodash/has'.. Для более ранней версии lodash (v3), который сам по себе довольно тяжелый, мы должны импортировать только specidic module/function вместо импорта всего lodash библиотека. Не уверен в более новой версии (v4).

import has from 'lodash/has';

против

import { has } from 'lodash';

Спасибо

Ответы

Ответ 1

import has from 'lodash/has'; лучше, потому что lodash содержит все функции в одном файле, поэтому вместо того, чтобы импортировать всю библиотеку lodash в 100k, лучше просто импортировать функцию lodash has, которая может быть 2k.

Ответ 2

Если вы используете webpack 4, следующий код будет сжимаемым деревом.

import { has } from 'lodash-es';

Замечания;

  1. Модули CommonJS не дрожат от дерева, поэтому вам обязательно нужно использовать lodash-es, который является библиотекой Lodash, экспортируемой как ES-модули, а не lodash (CommonJS).

  2. lodash-es package.json содержит "sideEffects": false, который уведомляет веб-пакет 4 о том, что все файлы внутри пакета свободны от побочных эффектов (см. https://webpack.js.org/guides/tree-shaking/#mark-the -file-as-side-effect-free).

  3. Эта информация имеет решающее значение для встряхивания деревьев, поскольку модульные связки не создают файлы встряхивания деревьев, которые могут содержать побочные эффекты, даже если их экспортированные элементы не используются нигде.

редактировать

Начиная с версии 1.9.0, Parcel также поддерживает "sideEffects": false, threrefore import { has } from 'lodash-es'; также является деревом, трясущимся с посылкой. Он также поддерживает древовидные модули CommonJS, хотя, скорее всего, встряхивание ES модулей более эффективно, чем CommonJS, в соответствии с моим экспериментом.

Ответ 3

Если вы используете babel, вы должны проверить babel-plugin-lodash, это будет вишня - выберите части lodash, которые вы используете для вас, меньше хлопот и меньшего пакета.

Он имеет несколько ограничений:

  • Вы должны использовать импорт ES2015 для загрузки Lodash
  • Babel <6 & Node.js <4 arent поддерживается
  • Поддерживаются последовательности цепочек. См. Это сообщение в блоге для альтернатив.
  • Поддержка модульных пакетов

Ответ 4

Импорт определенных методов внутри фигурных скобок

import { map, tail, times, uniq } from 'lodash';

Плюсы:

  • Только одна строка импорта (для приличного количества функций)
  • Более читабельное использование: map() вместо _.map() позже в коде javascript.

Минусы:

  • Каждый раз, когда мы хотим использовать новую функцию или перестать использовать другую - ее необходимо поддерживать и управлять