Установка lodash

Всем привет. Урок про установку lodash я до этого не снимал, но, так как в комментариях возникли вопросы по его установке, то давайте пройдемся по его вариантам установки. Сразу замечу что они описаны на оффициальном сайте lodash на главной странице в секции installation.

Итак вариант 1:

Если у вас есть обычная html страничка вы можете просто подключить скрипт lodash с cdn. Для этого в разделе download на сайте lodash выбираем ссылку CDN и видим прямые ссылки на js файл

<script src="https://cdn.jsdelivr.net/lodash/4.10.0/lodash.js"></script>

вы можете взять обычную или минифицированную версию и подключить к себе на страницу. Если мы вставим скрипт в конец body и попробуем открыть в браузере, то . нам доступен в консоли и, например, метод .isArray нам доступен и мы можем проверить, что lodash работает нормально.

_.isArray([1,2])

Такая запись вернет нам true. При такой установке lodash будет доступен в window и соответственно в всех созданных функциях

Второй вариант по подключению абсолютно такой же, но только мы качаем файл lodash.js и кладем его рядом с html страничкой. Путь для подключения будет такой

<script src="lodash.js"></script>

И результат такой же - в window нам доступен lodash. И метод, например, isEqual нам доступен в браузере.

_.isEqual(1,2)

И третий вариант, который мы сейчас разберем, самый геморройный, но чаще всего используется на проектах, так как подключать все скрипты руками достаточно затратно с точки зрения разработки.

Я для этого использую webpack. Вот у меня есть конфиг для него. То есть webpack будет собирать все, что находится в файле entry.js и будет это все засовывать в файл bundle.js. Подробнее о webpack вы можете посмотреть в других моих уроках.

Сейчас у нас есть файл 3.html в котором подключен скрипт

<script src="bundle.js"></script>

В файле entry.js мы пишем вот такие строки

var _ = require('lodash');
console.log(_.isEqual(1, 2));

В первой строчке мы подключаем lodash, как зависимость из npm пакета. В второй строчке мы используем метод lodash isEqual.

Для того, чтобы это работало, нам нужно установить пакет lodash из npm.

npm install lodash

Также не забудьте, что webpack у вас должен быть установлен как глобально, так и локально.

npm install webpack
npm install webpack -g

Теперь если мы запустим webpack, это соберет нам наш файл entry.js и если мы посмотрим на файл 3.html, то в браузере у нас вывелось false, так как 1 не равно 2.

Если же мы выведем в консоли

_.isEqual(1,2)

Мы увидим, что как только мы зарекваирили лодаш, он сразу же стал доступен в window.

На сегодня все. Вот вы и научились подключать lodash к любому проекту.