NPM — отличная библиотека пакетов JavaScript. Существует ряд доступных пакетов, которые вы можете использовать для создания крутых вещей. Мы можем использовать пакеты, созданные другими разработчиками, но мы также можем публиковать наши пакеты.

Я также создал два пакета (Headx и CarrierJS) и один интерфейс командной строки (ZEN). И некоторые люди скачали их.

В этой статье я покажу вам, как вы можете опубликовать свой пакет в каталоге NPM.

Шаг — 1 — необходимо установить Node JS

Чтобы использовать npm, сначала в вашей системе должен быть установлен узел. Если узел не установлен в вашей системе, вы можете скачать его по ссылкам ниже -

1. Node Js (установщик окон)

2. Node Js (установщик для Mac)

Вы можете посетить официальный сайт node js.

Шаг – 2. Необходимо создать учетную запись NPM

Учетная запись npm необходима для публикации пакета в npm, вы можете создать учетную запись npm, нажмите здесь.

  1. Нажмите кнопку Зарегистрироваться.
  2. Введите свое имя пользователя, адрес электронной почты и пароль.
  3. Затем нажмите кнопку Создать учетную запись.
  4. Подтвердите свой адрес электронной почты с помощью ссылки для подтверждения, которую вы получите на указанный вами адрес электронной почты.
  5. Если у вас уже есть учетная запись, нажмите кнопку Войти прямо на главной странице или нажмите У вас уже есть учетная запись? кнопка на странице регистрации.

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

Шаг — 3 — Инициализируйте репозиторий git и добавьте его в профиль github

Затем создайте папку и инициализируйте репозиторий git, чтобы отслеживать все ваши изменения.

Чтобы создать папку, вы можете использовать команду ниже —

mkdir <folder_name>

Зайдите в свою папку, которую вы создали с помощью вышеуказанной команды -

cd <folder_name>

Теперь настройте репозиторий git, используя следующие команды:

git init
git add .
git commit -m "first commit"
git remote add origin https://github.com/<yourusername>/<repo>.git
git push origin master

Шаг — 4 — Инициализировать проект с помощью npm

Инициализация Npm используется для добавления сведений о проекте в файл package.json, который будет общедоступным в реестре npm.

Теперь перейдите к терминалу, перейдите к своему проекту и введите следующую команду:

npm init

Эта команда запросит у вас некоторую информацию, связанную с вашим проектом.

  • имя пакета —имя пакета должно быть уникальным
  • версия —оставить как есть на данный момент
  • точка входа —укажите точку входа вашего пакета. пока оставьте index.js

Шаг — 5 — Написание кода нашего пакета

  1. Создайте файл index.js внутри корневого каталога пакета.
  2. Откройте редактор кода, я использую VS Code
  3. Введите следующий код в файл index.js
let sortedArray = [];
/**
* @desc removes all the duplicates from the array
* @param {*} value // Accepts array
*/
function sortArray(arr) {
     // arr : array of values
     if (!Array.isArray(arr)){
       throw new TypeError('arr should be an array');
     }
     sortedArray = arr.sort();
     return sortedArray;
}
let fruits = ["Banana", "Orange", "Apple", "Mango"];
let num = [5, 9, 4, 2, 8, 7];

let fruitsArr = sortArray(fruits);
let numArr = sortArray(num);

console.log(fruitsArr);
console.log(numArr);

4. Теперь пришло время протестировать наш код.

5. Откройте терминал и введите команду ниже.

node index.js

6. Ваш вывод должен выглядеть так:

Шаг — 6 — Локальное тестирование пакета

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

  1. Во-первых, замените полужирный код из приведенного выше кода файла index.js кодом ниже:
module.exports = sortArray

2. Наш файл index.js будет выглядеть так:

let sortedArray = [];
/**
* @desc removes all the duplicates from the array
* @param {*} value // Accepts array
*/
function sortArray(arr) {
     // arr : array of values
     if (!Array.isArray(arr)){
       throw new TypeError('arr should be an array');
     }
     sortedArray = arr.sort();
     return sortedArray;
}
module.exports = sortArray

3. Откройте терминал и в корневом каталоге пакета выполните приведенную ниже команду.

npm link

эта команда позволит вам использовать ваш пакет локально, как если бы вы установили его из npm.

4. Создайте фиктивный проект и установите в него свой пакет с помощью этой команды -

npm link name_of_your_package

если все пойдет хорошо, то можно двигаться дальше.

Шаг — 7 — Войдите в npm с помощью командной строки

Выполните следующую команду, чтобы войти в свою учетную запись npm

npm login

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

После успешного входа в систему вы можете перейти к следующему шагу.

Шаг — 8 — Публикация пакета в npm

Помните, что имя вашего пакета должно быть уникальным в вашем файле package.json. иначе ваш пакет не будет опубликован на npm.

Чтобы проверить, является ли ваше имя пакета уникальным в npm или нет, вы можете использовать следующую команду.

npm search your_package_name

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

можно попробовать другое имя.

Не забудьте изменить имя пакета в файле package.json, если он недоступен в npm, например:

{
"name": "dosorting",
"version": "1.0.0",
"description": "",
"main": "index.js",
"keywords": [],
}

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

npm publish

после успешной публикации вы получите письмо, и вы получите следующее сообщение на своем терминале.

npm notice name:          dosorting
npm notice version:       1.0.0
npm notice package size:  484 B
npm notice unpacked size: 597 B
npm notice shasum:        a84844e7899b12621b3bfd1ebb9cf9e1f673249d
npm notice integrity:     sha512-WOzSOxRxTp+eG[...]aJ6iDgzOdZdXg==
npm notice total files:   2
npm notice
+ [email protected]

Поздравляем, вы опубликовали свой первый пакет на npm.

Если вы хотите внести изменения в свой пакет,

  1. затем внесите изменения.
  2. откройте файл package.json и измените номер версии
  3. войдите в свою учетную запись npm и повторно выполните следующую команду
npm publish

Здесь, в этой статье, мы создали базовый и простой пакет. Не забудьте добавить файл README.md в корневой каталог вашего пакета, он поможет вам описать ваш пакет и то, как другие могут его использовать.

Спасибо за чтение….