для чего нужен npm
NodeJS. Что такое NPM.
Всем привет! В этой статье мы рассмотрим, что такое NPM, зачем он нужен и как его использовать в NodeJS.
Введение
Node Package Manager(NPM) – это менеджер пакетов, который устанавливается вместе с платформой NodeJS. NPM – причина того, почему NodeJS так популярен. Этот пакетный менеджер представляет собой огромную экосистему платформы. Благодаря ему мы можем установить любой пакет, созданный другими разработчиками, для облегчения решения нами какой-нибудь задачи. Это отличный помощник при работе с платформой.
Например, есть очень полезный и потому популярный пакет под названием Express. Он позволяет очень легко создать навигацию по страницам. Используя данный пакет, мы можем избавить себя от тех проблем, с которыми мы столкнулись при реализации данного функционала вручную в прошлой статье. Но как устанавливать пакеты?
Установка пакетов
Для начала зайдите на сайт www.npmjs.com. Вверху вы увидите строку поиска, куда вы можете ввести название интересующего вас пакета. Например, если вы введете слово express, то получите все результаты, где оно присутствует. Перейдя по первой ссылке, вы попадете на сам пакет. Здесь написана вся информация, которая вам понадобится при работе с ним.
Давайте установим пакет express. Для этого найдите там команду под надписью Installation и скопируйте ее. Откройте командую строку, перейдите в наш проект, вставьте скопированную ранее команду и нажмите Enter. Начнется процесс скачивания и установки пакета в папку с вашим проектом. После окончания операции, вы увидите, что в корне появилась новая директория под названием node_modules. Если вы зайдете в нее, то найдете там достаточно много папок, каждая из которых содержит отдельный модуль. Среди них будет и установленный нами express.
Удаление пакетов
Иногда бывает нужно удалить пакет из проекта. Чтобы это сделать, введите в командной строке следующее:
npm uninstall express
После нажатия клавиши Enter, пакет будет удален.
Заключение
Итак, сегодня мы рассмотрели, что такое NPM, зачем он нужен и как с ним работать в NodeJS.
Спасибо за внимание!
Копирование материалов разрешается только с указанием автора (Михаил Русаков) и индексируемой прямой ссылкой на сайт (http://myrusakov.ru)!
Добавляйтесь ко мне в друзья ВКонтакте: http://vk.com/myrusakov.
Если Вы хотите дать оценку мне и моей работе, то напишите её в моей группе: http://vk.com/rusakovmy.
Если Вы не хотите пропустить новые материалы на сайте,
то Вы можете подписаться на обновления: Подписаться на обновления
Если у Вас остались какие-либо вопросы, либо у Вас есть желание высказаться по поводу этой статьи, то Вы можете оставить свой комментарий внизу страницы.
Порекомендуйте эту статью друзьям:
Если Вам понравился сайт, то разместите ссылку на него (у себя на сайте, на форуме, в контакте):
Комментарии ( 0 ):
Для добавления комментариев надо войти в систему.
Если Вы ещё не зарегистрированы на сайте, то сначала зарегистрируйтесь.
Copyright © 2010-2021 Русаков Михаил Юрьевич. Все права защищены.
Использование NPM
Node Hero: Глава 2
В этой главе вы узнаете, что такое NPM и как его использовать. Давайте приступим к изучению!
NPM в двух словах
NPM — это менеджер пакетов, используемый Node.js-приложениями. В нём вы можете найти массу готовых модулей, поэтому вам не нужно изобретать колесо. Это похоже на Maven для Java или Composer для PHP. Существует два основных интерфейса, с которыми вы будете взаимодействовать: сайт NPM и набор инструментов командной строки (CLI).
И веб-сайт, и CLI используют один и тот же реестр, чтобы искать и отображать модули.
Вебсайт
Сайт NPM можно найти по адресу https://npmjs.com. Здесь вы можете зарегистрироваться как новый пользователь или поискать нужные пакеты.
Интерфейс командной строки
Чтобы запустить CLI, достаточно написать:
Использование NPM: Учебное пособие
Добавление зависимостей
В этом разделе вы узнаете, как добавлять рантайм зависимости к вашему приложению.
Это означает, что lodash версии 4.6.1 теперь установлен и готов к использованию. Обратите внимание, что NPM следует правилам SemVer для версионирования пакетов.
Используя нумерацию версий вида MAJOR.MINOR.PATCH, повышайте MAJOR-версию, когда вы делаете несовместимые изменения API, MINOR-версию, когда вы добавляете функциональность обратно-совместимым образом, и PATCH-версию, когда вы делаете исправления ошибок с обратной совместимостью. Для получения дополнительной информации: http://semver.org/
Поскольку lodash готов к использованию, давайте посмотрим, как мы можем им воспользоваться! Вы можете сделать это так же, как и с вашим собственным модулем, но теперь вам не нужно указывать полный путь, достаточно только имени модуля:
Добавление зависимостей для разработки
В этом разделе вы узнаете, как добавлять зависимости, необходимые только во время сборки приложения.
Когда вы собираете веб-приложения, вам может потребоваться минимизировать ваши JavaScript-файлы, объединить CSS-файлы и так далее. Модули, которые это сделают, будут выполняться только во время создания ресурсов, поэтому работающее приложение не нуждается в них.
Вы можете установить такие скрипты с помощью:
NPM-скрипты
NPM-скрипты — очень мощная концепция, с их помощью вы можете создавать небольшие утилиты или даже описывать сложные системы сборки.
Что следует здесь отметить:
Ограничение области видимости и приватные пакеты
Первоначально у NPM было глобальное пространство имен для названий модулей, и с более чем 250 000 модулями в реестре большинство простых имен уже заняты. Кроме того, глобальное пространство имен содержит только общедоступные модули.
В NPM урегулировали эту проблему внедрением пакетов с ограниченной областью видимости ( scoped packages), они имеют следующий шаблон именования:
Вы можете устанавливать пакеты с ограниченной областью видимости так же, как и раньше:
Они будут отображаться в вашем package.json следующим образом:
Подключения пакетов с ограниченной областью видимости работает должным образом:
Вы не знаете npm
Перевод и небольшое творческое переосмысление доклада Ashley Williams(человека из команды разработчиков npm) с конференции JavaScript fwdays’17, которая прошла 22 апреля 2017 года в Киеве, Украина. Целью статьи я не ставил дословно перевести выступление Ashley, для вас будет представлена выжимка основных моментов, а именно – фишки npm, о которых не все знают, но знать о которых полезно каждому. В подвале я оставлю ссылку на страницу выступления на сайте frameworksdays.com, где вы сможете найти видео выступления, презентацию и контакты самой Ashley, если они вам понадобятся.
Команда npm prune docs.npmjs.com/cli/prune удаляет модули, которые вы установили, но не использовали в вашем проекте. Так же она оптимизирует дерево зависимостей, рекомендуется использовать эту команду перед публикацией вашего npm-пакета в репозитории npm.
npm shrinkwrap – эта команда помогает проекту запомнить конкретные версии всех модулей, на которые он опирается. Если вы опубликовали модуль, и ваш друг решит установить его через условную неделю, то он получит текущую версию проекта вместе с текущими версиями каждой из зависимостей. Если для корректной работы модуля нужные конкретные версии npm-пакетов от которых он зависит – используйте команду shrinkwrap перед его публикацией. Для старых версий npm необходимо было использовать эту директиву после установки каждой новой зависимости, сейчас же достаточно использовать shrinkwrap единожды.
Указать версию/изменение версии вашего проекта можно, использовав команду npm version docs.npmjs.com/cli/version узнать о типах версий npm-пакетов, посмотреть различные возможные версии пакетов, которые вы используете, и узнать больше об именовании версий можно по этой ссылке semver.npmjs.com. Если коротко, то разработчики npm рекомендуют нумеровать версии ваших проектов с 1.0.0. Считается, что если версия ниже, например, 0.1.1 – то это предрелизная версия, ещё не готовая к публикации в системе npm, но, к сожалению, не все разработчики придерживаются этой конвенции именования. Первая цифра в обозначении 1.0.0, обозначает тип major – то есть глобальное обновление проекта. Вторая – minor, не столь глобальные изменения и третья – просто patch.
Команда npm run запускает скрипты, указанные вами в разделе «scripts» файла package.json, к примеру, тесты. А чтобы не забыть применить тесты перед публикацией проекта или коммитом вы можете воспользоваться модулем husky www.npmjs.com/package/husky, который добавляет в соответствующий раздел нужные директивы.
Помимо .npm-init.js вы так же можете создать файл .npmignore. Оформляется он так же, как .gitignore, только в этом файле перечисляются имена тех файлов и подкаталогов, которые не должны попасть в npm-пакет вашего модуля. Прочитать об этом подробнее можно в документации docs.npmjs.com/misc/developers, я лишь добавлю, что в отсутствии файла .npmignore npm использует исключения заданные в файле .gitignore, если вас это не устраивает, просто, создайте пустой .npmignore. Так же есть файлы, исключить которые невозможно, например README или package.json.
Если вы впервые публикуете npm-пакет — присмотритесь к модулю под названием np: www.npmjs.com/package/np. Он поможет вам правильно подготовить проект к публикации. А если вы работаете в команде – директива npm team поможет вам сформировать группу и настроить права доступа на публикации модуля.
Примечание переводчика: Это большая часть речи Ashley, если вам интересно поглядеть всё выступление, то оно доступно тут. Я не стал переводить некоторые вещи, касающиеся того, как удалить проект из системы и прочего, что не втискивается в рамки: «набери вот эту команду» или «установи вот этот модуль и будет тебе счастье».
Как искать и выбирать npm-пакеты? Шпаргалка для начинающих
Что делает разработчик, если ему нужно раскрасить кнопку в красный цвет? Ищет в npm пакет, окрашивающий кнопки в красный цвет.
В реестре npm существует более миллиона пакетов для решения практически любых задач разработчика. Например, с их помощью можно минифицировать код, удалять и переименовывать файлы, создавать спрайты, отправлять сообщения в центр уведомлений операционных систем, работать с препроцессорами Less и Sass и выполнять многие другие действия, упрощающие и автоматизирующие работу над проектом.
Конечно, бездумно использовать менеджер пакетов не стоит: некоторые задачи можно решить и без него. Но всё же npm-пакеты полезны и постоянно применяются в веб-разработке. Поэтому важно знать, как их правильно выбрать, где искать и на что обратить внимание перед установкой.
Как искать подходящий npm-пакет?
Сначала нужно понять, для чего он вам нужен. Предположим, вы хотите автоматически расставить префиксы в свой код. Если вы уже работали с подходящим пакетом и знаете, как он называется, просто открываете сайт npmjs.com и вводите название в строку поиска. Например, «autoprefixer».
Точное совпадение по названию пакета
Если не знаете, какой пакет позволяет это сделать — открываете браузер и вводите в поиске запрос о том, какой npm-пакет подключить для создания HTTP-клиента. Обычно в поисковой выдаче сразу же появляются ссылки на страницы сайта npmjs.com или другие сайты, на которых разработчики обсуждают подходящие варианты.
Гуглим пакет по примерному описанию
Если не получится найти самостоятельно, всегда можно попросить помощи на профессиональных форумах. Например, на Хабре или StackOverflow.
Как выбрать npm-пакет?
Реестр npm — это общедоступная коллекция. Здесь любой разработчик может предложить свой вариант кода, поэтому для решения каждой задачи существует сразу несколько схожих пакетов: десятки или даже сотни готовых вариантов. Но если их бездумно добавлять в свой проект, ситуация может выйти из-под контроля. И поэтому приходится тщательно выбирать.
Чтобы помочь разработчикам, команда npm ввела критерии, по которым можно отсортировать пакеты и выбрать из них наиболее подходящий. Есть четыре условия ранжирования: по популярности, качеству, обслуживанию и оптимальности.
Обслуживание (maintenance). Сортирует пакеты по уровню поддержки кода разработчиками. Считается, что пакеты с хорошей поддержкой будут лучше работать с текущими или будущими версиями npm CLI — интерфейсом командной строки. Обслуживание — это один из важнейших параметров, ведь порой даже высокорейтинговые пакеты с миллионными загрузками перестают поддерживать. Для них не выпускают обновления и не исправляют ошибки, поэтому использование такого пакета рано или поздно может привести к проблемам.
Посмотреть дату последнего обновления можно как в репозитории GitHub (слева), так и прямо на странице пакета на сайте npmjs.com (справа).
Популярность (popularity). Сортирует пакеты по количеству загрузок: чем больше разработчиков использует пакет, тем больше к нему доверия. Сравнить популярность можно и без сортировки. Для этого посмотрите количество еженедельных загрузок на странице пакета на сайте npmjs.com или зайдите в репозиторий на Github и сравните количество звёзд.
Звёзды на Github похожи на лайки в социальных сетях — чем их больше, тем репозиторий популярнее. 
На странице пакета на сайте npmjs.com можно увидеть еженедельное число загрузок пакета.
Любопытный факт: на GitHub 16 млн репозиториев, у которых есть хотя бы одна звезда. 1800 имеют более 10 тыс звезд и всего у 20 репозиториев более 100 тыс звезд.
Качество (quality). Учитывает стабильность, наличие файла README, тесты, актуальные зависимости и сложность кода. Его тоже можно проверить без сортировки. Для этого зайдите в репозиторий проекта, посмотрите на коммиты и файлы, в том числе README. Последний заслуживает особенного внимания, потому что содержит информацию о проекте: как устанавливать пакет и как работать с кодом.
Пример файла README, который описывает установку пакета CSSO — минификатора CSS.
Оптимальность (optimal). Это универсальный критерий, который объединяет перечисленные выше условия сортировки: популярность, качество и обслуживание.
Коротко
Выбирайте пакеты с регулярной поддержкой, актуальными зависимостями и качественной документацией. Если сравниваете между несколькими подходящими вариантами, отдавайте предпочтение npm-пакетам с высоким рейтингом и большим количеством загрузок.
А когда сделаете выбор — загляните ещё и на другие ресурсы. Посмотрите обзоры других разработчиков и только после этого решайте, стоит ли использовать пакет в своем проекте или поискать что-то другое.
Какие пакеты чаще используют фронтенд-разработчики?
Разработчики подбирают npm-пакеты в зависимости от поставленных целей. К примеру, HTML Academy использует в учебных проектах несколько npm-пакетов, которые полностью автоматизируют рутинные задачи разработки.
Чтобы оптимизировать картинки, уменьшить их вес и перевести в новый формат, наши студенты и стажёры используют gulp-svgstore, imagemin и gulp-webp. Для минификации HTML и CSS файлов применяют csso и html-minifier. Но так как в production-окружении важно иметь возможность просмотреть сжатый код, дополнительно устанавливают gulp-sourcemaps.
Чтобы сделать код более читаемым и ускорить процесс разработки, студенты и стажёры используют препроцессоры. Поэтому в проект добавляют less или sass. А чтобы запустить локальный сервер и подготовить код к production-окружению, применяют gulp-plumber, del, browser-sync и другие npm-пакеты.
Шпаргалка по пакетному менеджеру NPM
Установка npm
Обновление npm
Есть несколько способов чтобы обновить npm. Я предпочитаю:
Поиск пакетов в npm
Подсказка: Можно также использовать search.npmjs.org
Вторая подсказка: Для поиска необходимо знать имя нужного пакета (всё прекрасно ищет по любому слову как в имени пакета, так и в его описании, может неправильно перевёл?)
Просмотр информации о пакете
Локальная установка пакетов
Для демонстрации возьмём пакет http-server.
http-server is a package we’ve written which provides an easy to use wrapper around node’s core http.Server class. This module makes for a good example, since it’s API provides both a CLI binary and a requirable node.js module.
http-server — пакет, который мы написали, предоставляет более простой интерфейс в использовании базового модуля http.Server из node.js. Этот модуль хороший пример использования API как для бинарного CLI, так и для подключаемого модуля node.js.
Так мы установим http-server в нашей рабочей директории.
Вы увидите новую папку в node_modules. Сейчас можете не обращать на это внимание.
Установка пакета в наше приложение
test.js
Обратите внимание, как мы делаем: require(‘http-server’)? Что это за магия? (автор молодец)
http-server не является базовым модулем node.js. Этот пакет мы только что установили из npm. Node.js и npm взаимодействуют и автоматически подключают наши локальные модули из node_modules директории.
Понимание разницы между глобальной и локальной установкой
test.js
теперь запустим наш скрипт
мы получим эту ошибку:
Это вполне логично, мы установили http-server локально в «/mynewapp/», а не в «/anotherapp/».
Есть два решения в этой ситуации:
а) Установить ещё раз пакет, но локально в наше новое приложение
б) Установить пакет глобально
Глобальная установка пакетов
Если вы хотите чтобы пакет был доступен всем приложениям, его нужно установить глобально:
Кроме того, поскольку http-server пакет имеет свой исполняемый файл, то этот файл также будет установлен как исполняемый http-server и доступен в командах.
Теперь вы можете просто запустить команду:
Удаление локально установленного пакета
Удаление глобально установленного пакета
Установка определённой версии пакета
Установка модуля с Github
Важно. В некоторых случаях будут патчи, форки или ветви, которые вы хотите использовать, но которые еще не были опубликованы в npm. К счастью исходные коды для большинства npm модулей также доступна на www.github.com
Теперь наша клонированная версия http-server связана локально.
Связи любых пакетов локально
Если у вас есть отдельный каталог содержащий пакет npm, то можно создать локальную связь для него. Это удобно в ситуациях, когда мы не хотим опубликовать наш пакет в хранилище npm.
На нашу локальную версию http-server создана «связана» для нашей локальной машины. (связь создаётся как «copy-paste», с начало нужно перейти в нужный катало и сделать «copy», потом перейти в нужный каталог и сделать «paste». Так вот сейчас мы изучили как делается «copy», а ниже будет про «paste» этого модуля)
Связи локальных пакетов для нескольких приложений
Как мы видели ранее npm устанавливает пакеты в локальный каталог по умолчанию. Так вот npm ссылка(связь) работает почти так же.
Мы указываем, что теперь создали связь из http-server в наше новое приложение newapp. Если бы мы не выполнили npm link http-server, то получили бы ошибку об отсутствующем модуле. (а вот наш и «paste» о чём я писал выше, теперь вам должна быть понятна логика создания связей)
Отмена связи между пакетами приложения
(здесь мы просто отменяем наш «paste» для этого приложения)
Отмена связи пакета в системе
(здесь мы отменяем наш «copy» для этого пакета)
Создание нового пакета
(от себя хочу лишь заметить, что создание пакета не такая простая задача в одну команду, подробнее можно почитать в другой статье)
Добавление нового пользователя
Публикация пакета в репозиторий npm
Удаление пакета из репозитория npm
Управление правами доступа к пакетам в репозитории npm
Вы можете задать права доступа других пользователей к опубликованному пакету: