Команды и основные принципы, которые вам следует усвоить.

NPM или Node Package Manager - это краеугольный камень современной веб-разработки. Работаете ли вы с Node.js или создаете интерфейс с такой библиотекой, как React или Angular, этот навык неизбежен.

Я не могу представить разработку приложения без использования NPM (но я уверен, что есть способ). Он позволяет управлять пакетами и предоставляет удобный интерфейс для работы с ними.

Установка NPM

Если вы хотите инициализировать NPM для своего проекта, на вашем компьютере должен быть установлен Node.js. Сюда входит все необходимое для начала.

Скачать Node можно с официальной страницы. Просто следуйте инструкциям, и все готово.

Теперь, чтобы убедиться, что NPM присутствует на вашем компьютере, вы можете открыть терминал и ввести следующую команду:

npm -v

Он должен отображать текущую версию установленного пакета, например 6.13.4.

npm init

Чтобы установить, обновить или удалить пакеты в вашем проекте, необходимо инициализировать package.json. Этот файл уже есть в большинстве начальных пакетов, таких как Create React App. В этом случае вы можете пропустить этот шаг.

В противном случае вы можете инициализировать npm с помощью следующей команды:

npm init -y

Примечание: если вы хотите генерировать package.json быстрее, вы можете добавить к команде флаг -y.

Демонтаж package.json

Теперь, чтобы хорошо понимать, как работает NPM и как правильно обрабатывать конфигурацию проекта, вы должны знать, что package.json включает.

Приведем пример из пакета Create React App:

  • Вы можете увидеть все установленные пакеты в dependencies и devDependencies. В чем разница?
  • dependencies должен содержать библиотеки и фреймворки, на которых построено ваше приложение, такие как Vue, React, Angular, Express и т. Д. Эти пакеты, очевидно, используются как в производстве, так и во время разработки.
  • devDependencies должен содержать пакеты, используемые во время разработки или которые используются для сборки вашего пакета, например, библиотеки тестирования, jest, gulp-jade и т. Д. Эти пакеты необходимы только на время разработки вашего проекта.
  • Вы можете определить свои собственные команды в thescripts. Например, запустив npm start, вы запустите приложение React локально или выполнив npm test все написанные модульные тесты.

Примечание. Будьте осторожны при запуске npm eject, потому что это односторонняя операция!

npm eject скопирует все файлы конфигурации и транзитивные зависимости (Webpack, Babel, ESLint и т. Д.) В ваш проект как зависимости в package.json. Это может быть полезно, если вы хотите самостоятельно настроить связывание и сборку проекта.

Управление версиями зависимостей

Каждый пакет в package.json записан в виде пары "ключ-значение". Ключ - это имя пакета, а значение - версия.

Номер версии указан в S emVer syntax (спецификация семантического управления версиями), который обозначает каждый раздел с разным значением. SemVer разбит на три раздела, разделенных точкой:

"react-scripts": "3.3.0"
// "react-scripts": major.minor.patch

Major, minor и patch представляют разные выпуски пакета:

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

А как насчет ~ и ^?

npm использует тильду (~) и каретку (^), чтобы указать, какой патч и второстепенные версии использовать соответственно.

Итак, если вы видите ~1.0.2, это означает установку версии 1.0.2 или последней версии патча, например 1.0.4. Если вы видите ^1.0.2, это означает, что установлена ​​версия 1.0.2 или последняя дополнительная версия или версия исправления, например 1.1.0.

npm install

Теперь, когда вы знаете, что включает package.json, вы, вероятно, захотите установить в свой проект другие зависимости. Сделать это можно так:

npm i lodash --save

i означает установку, а lodash - имя пакета. Вы также должны добавить флаг --save, чтобы сохранить его в dependencies.

Если вы хотите установить пакет как devDependency, вы должны добавить флаг --save-dev или просто -D.

Чтобы установить зависимость на вашем компьютере глобально, добавьте флаг -g, и все готово.

Примечание. Вы всегда должны читать документацию к пакету независимо от того, следует ли его устанавливать в dependencies или devDependencies.

обновление npm

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

Что ж, во-первых, давайте разберемся, какие зависимости следует обновить:

npm outdated

Вы получите таблицу, подобную этой:

В этой таблице показано, что пакеты следует обновить до версии, указанной в столбце «Требуются». Вы можете исправить это с помощью следующей команды:

npm update
// or
npm update <dependency_name>

Однако, если для зависимости требуется серьезное обновление, она не будет работать с этой командой, потому что она включает критические изменения.

Эти случаи следует обновить вручную, переписав версию в package.json и запустив npm install. После этого вам следует просмотреть свой код и протестировать приложение.

аудит npm

Это может быть довольно неприятно, если вы установите желаемые пакеты и в последней строке увидите следующее:

Для просмотра подробностей вы можете запустить команду npm audit:

Вы получите подробный список пакетов, в которых есть уязвимости. Если вы посмотрите на поле Path, оно показывает путь зависимости. Итак, в этом случае react-scripts зависит от jest, который зависит от jest-cli и т. Д. В конце концов, вид зависимости содержит уязвимость, которую необходимо исправить.

Многие уязвимости можно исправить, выполнив обновление зависимостей, упомянутых выше, или это:

npm audit fix

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

Заключительные слова

С каждым новым выпуском NPM делает огромные шаги в мире фронтенд-разработки. По словам его соучредителя Лори Восс, его пользовательская база меняется, и большинство из тех, кто его использует, вообще не используют его для написания Node.

Скорее, он превращается в инструмент, который люди используют для объединения JavaScript во внешнем интерфейсе, и инструмент, который становится неотъемлемой частью написания современного JavaScript.

Однако его обратная сторона - регулярные обновления зависимостей, которые могут вызвать много проблем при поддержке проектов. Поэтому хорошей практикой является определение стратегии разработки и сопровождения параллельно.

Спасибо за прочтение!