↑↑

↓↓
🏠 | 💻 IT |

Node Package Manager

Введение

Установка

Входит в состав Nodejs поэтому не требует отдельной установки.

Об установке Nodejs читайте в статье установка Nodejs

Узнать версию

Проверить версии установленных Nodejs, npm и npx можно следующими командами

$ node --version

v10.16.3

$ npm --version

6.9.0

$ npx --version

6.9.0

Начало работы

Логично начать с создания директории для нового проекта.

Я буду работать над сайтом HeiHei.ru поэтому назову папку heihei

mkdir heihei

Перейдём в созданную директорию

cd heihei

Убедимся, что в новой папке пусто

ls


Теперь выполним важнейшую для будущей разработки команду

$ npm init

This utility will walk you through creating a package.json file.
It only covers the most common items, and tries to guess sensible defaults.

See `npm help json` for definitive documentation on these fields
and exactly what they do.

Use `npm install ` afterwards to install a package and
save it as a dependency in the package.json file.

Press ^C at any time to quit.
package name: (my-project)

npm предложит заполнить информацию о проекте. Появятся следующие поля:

name: (heihei)
version: (1.0.0)
description:
entry point: (index.js)
test command:
git repository:
keywords:
author:
license: (ISC)

Можно заполнить все поля, но для простоты пока просто нажмем несколько раз подряд Enter

Если предварительно привязать директорию к удалённому репозиторию GIT то npm при инициализации это увидит и сам заполнит пункт git repository.

Возможно, это и есть самый простой и правильный путь, если Вы планируете работать дальше с GIT.

В конце должно появиться подобное сообщение. Нажимаем Enter ещё раз.

About to write to C:\Users\ao\Desktop\Sites\heihei\package.json:

{
"name": "heihei",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC"
}


Is this OK? (yes)

Проверим, что появилось в нашей папке после инициализации

ls

package.json

package.json это файл, который будет хранить в себе список установленных пакетов и их версии.

Сразу после инициализации он содержит только информацию о проекте

{ "name": "heihei", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1" }, "author": "", "license": "ISC" }

Установка пакетов

Установим первый пакет. Начнём с jquery.

npm install jquery

npm notice created a lockfile as package-lock.json. You should commit this file.
npm WARN heihei@1.0.0 No description
npm WARN heihei@1.0.0 No repository field.

+ jquery@3.4.1
added 1 package from 1 contributor and audited 1 package in 1.227s
found 0 vulnerabilities

В версиях NPM ниже 5.0.0 при установке пакетов не происходило автоматической записи в файл package.json

Для того, чтобы обновить package.json нужно было устанавливать с опцией --save

Например: npm isntall jquery --save

В новых версиях это происходит автоматически, но --save ещё используется для того, чтобы задать как именно установить пакет.

Популярный вариант это --save-dev который позволяет сделать установку, скажем так для «разработки и тестирования»

Пример такой установки я разбираю в статье Gulp

Подробнее можно прочитать здесь, docs.npmjs.com/cli/install

Если Вам нужно установить не последнюю версию jquery а архивную используйте @номер_версии. Например:

npm install jquery@3.3.1

Проверим, что появилось в нашей папке после установки первого пакета

ls

node_modules/ package.json package-lock.json

Файл package-lock.json появиля в пятой версии NPM как дополнительное средство контроля совместимости.

Особенно для случаев когда файл package.json скопирован и через некоторое время с его помощью произвели инициализацию (npm init), но за это время какой-то из пакетов успел получить новую версию.

Подробнее про это можно прочитать здесь, здесь, здесь

Про контроль версий можно прочитать на сайте semver.org

Посмотрим содержимое файла package-lock.json

{ "name": "heihei", "version": "1.0.0", "lockfileVersion": 1, "requires": true, "dependencies": { "jquery": { "version": "3.4.1", "resolved": "https://registry.npmjs.org/jquery/-/jquery-3.4.1.tgz", "integrity": "sha512-36+XXXX XXXXXXXXXXXXXXX XXXXXXXXXXXXXXX XXXXXXXXXXXXGoB d+tHdrBMiyjGQs0 Hxs/MLZTu/eHNJJuWPw==" } } }

Посмотрим, что лежит в папке node_modules. После установки jquery логичным будет, увидеть там папку jquery

$ ls node_modules/

jquery/

В данном случае всё очевидно, но огромное количество пакетов создадут не одну папку а сразу несколько.

Старые версии npm создавали всегда одну папку и размещали все зависимости туда.

Новые версии npm сохраняют зависимости в node_modules.

Посмотрим, что лежит в папке node_modules/jquery.

$ ls node_modules/jquery/

AUTHORS.txt bower.json dist/ external/ LICENSE.txt package.json README.md src/

Как Вы можете видеть у jquery есть свой собственный файл package.json на данном этапе он гораздо содержательней нашего корневого package.json но это не надолго.

Установка определённой версии пакета

Установим ещё один пакет и поговорим о его возможных версиях

$ npm install normalize.css

Если package.json не содержит записи о normalize.css то будет установлена последняя стабильная версия.

Если в package.json указана версия, будет установлена она.

Если Вы хотите установить какую-то определённую версию, укажите её в package.json либо введите @номер_версии при установке.

Например npm install normalize.css@8.0.1

npm WARN heihei@1.0.0 No description
npm WARN heihei@1.0.0 No repository field.

+ normalize.css@8.0.1
added 1 package and audited 2 packages in 0.523s
found 0 vulnerabilities

Посмотрим содержимое файла package.json и заодно узнаем какие версии пакетов установлены

$ vi package.json

{ "name": "heihei", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1" }, "author": "", "license": "ISC", "dependencies": { "jquery": "^3.4.1", "normalize.css": "^8.0.1" } }

Пакетов npm очень много. Чтобы изучить их все - зарегистрируйтесь на сайте www.npmjs.com

Удобство файла package.json заключается в том, что если Вы хотите скопировать Ваш проект - достаточно перенести файл package.json и выполнить команду npm init.

Все пакеты, перечисленные в package.json будут установлены с указанными версиями.

Ошибки

If you have any questions - feel free to ask in the comments section below

Share in social media: