0Pricing
Vue Academy · Урок

Публикация в npm и семантическое версионирование

Поля package.json (main, module, exports), журналы изменений, semantic-release и процесс npm publish

«Публикация в npm и семантическое версионирование» — бесплатный урок Vue Academy на CoddyKit. Это урок 4 из 4. Ты можешь прочитать весь урок бесплатно ниже — а потом практиковать его прямо в браузере с встроенным редактором кода и ИИ-репетитором 24/7. Это часть пути обучения Vue Academy, и твой прогресс синхронизируется между веб-версией и приложением CoddyKit. Курс Vue Academy содержит 4 уроков всего.

Подготовка к публикации

Публикация делает вашу библиотеку доступной для установки через npm install. Перед этим в package.json нужно правильно объявить входные точки и определить, какие файлы войдут в пакет.

Поля main и module

main указывает на сборку CommonJS для старых инструментов, а module — на сборку ESM, чтобы современные сборщики выбирали версию, поддерживающую исключение неиспользуемого кода.

{
  "main": "./dist/my-ui-lib.cjs.js",
  "module": "./dist/my-ui-lib.es.js"
}

Карта exports

Современное поле exports определяет условные входные точки. Оно имеет приоритет над main/module и управляет доступом к подмаршрутам.

{
  "exports": {
    ".": {
      "types": "./dist/index.d.ts",
      "import": "./dist/my-ui-lib.es.js",
      "require": "./dist/my-ui-lib.cjs.js"
    },
    "./style.css": "./dist/style.css"
  }
}

Условные экспорты

Условия import, require и types позволяют Node и сборщикам находить правильный файл соответственно для ESM, CommonJS и TypeScript.

Управление публикуемыми файлами

Используйте поле files, чтобы составить список разрешённых файлов, или файл .npmignore, чтобы составить список запрещённых. Публикация dist и исключение исходного кода и тестов сохраняют небольшой размер пакета.

{
  "files": ["dist"]
}

.npmignore

Если вы предпочитаете список запрещённых файлов, .npmignore исключает файлы, даже если поле files не задано. Без одного из этих вариантов npm публикует почти всё.

# .npmignore
src
tests
vite.config.ts
*.log

Предпросмотр с помощью npm pack

Запустите npm pack, чтобы создать архив и точно проверить, что будет опубликовано, — это важная проверка безопасности перед выпуском.

npm pack
# inspect the listed files; nothing secret should appear

Семантическое версионирование

SemVer использует формат MAJOR.MINOR.PATCH. Увеличивайте patch для обратно совместимых исправлений ошибок, minor для обратно совместимых возможностей и major для несовместимых изменений.

Команды npm version

Команда npm version за один шаг увеличивает версию в package.json и создаёт тег git.

npm version patch   # 1.0.0 -> 1.0.1
npm version minor   # 1.0.1 -> 1.1.0
npm version major   # 1.1.0 -> 2.0.0

npm publish

npm publish загружает пакет. Для общедоступных пакетов с областью действия при первой публикации нужен флаг --access public.

npm publish --access public

prepublishOnly и dist-tag

Скрипт prepublishOnly обеспечивает выполнение свежей сборки перед публикацией, а --tag next публикует предварительные версии, не перемещая тег latest.

{
  "scripts": {
    "prepublishOnly": "npm run build"
  }
}
// npm publish --tag next

Быстрая проверка

Вы добавляете новое необязательное свойство, не нарушая существующее использование. Какую версию следует увеличить?

Итоги

Настройте main, module и условную карту exports (import/require/types), а публикуемые файлы контролируйте с помощью files или .npmignore. Проверьте содержимое с помощью npm pack, затем увеличьте версии согласно SemVer командой npm version patch/minor/major и выпустите пакет с помощью npm publish (добавив --access public для пакетов с областью действия).

Часто задаваемые вопросы

Урок «Публикация в npm и семантическое версионирование» бесплатный?

Да — полный текст урока «Публикация в npm и семантическое версионирование» бесплатно доступен здесь в веб-версии. Чтобы практиковать его интерактивно (встроенный редактор кода и ИИ-репетитор 24/7) и разблокировать остальной курс Vue Academy, подпишись на CoddyKit PRO. Курс Vue Academy содержит 4 уроков всего.

Чему я научусь в уроке «Публикация в npm и семантическое версионирование»?

Поля package.json (main, module, exports), журналы изменений, semantic-release и процесс npm publish Ты практикуешь Vue Academy с помощью реального кода, который запускаешь прямо в браузере, и ИИ-репетитор 24/7 отвечает на твои вопросы во время урока.

Нужен ли мне опыт, чтобы начать Vue Academy?

Предыдущий опыт не требуется. Vue Academy на CoddyKit структурирован для всех уровней — от новичков до продвинутых, поэтому ты можешь начать отсюда или с самого начала и учиться в своем темпе. Это урок 4 из 4.

Сколько времени занимает урок «Публикация в npm и семантическое версионирование»?

Большинство уроков CoddyKit занимают около 5–10 минут. Каждый из них компактный и интерактивный, поэтому ты постоянно делаешь прогресс и продолжаешь с того же места в веб-версии и приложении.

Можно ли писать и запускать код в этом уроке Vue Academy?

Да. Каждый урок Vue Academy включает встроенный редактор кода, поэтому ты пишешь и запускаешь реальный код прямо в браузере и получаешь моментальную обратную связь от AI — локальная установка не требуется.

Все уроки этого курса

  1. Настройка библиотечного режима Vite
  2. Объявления TypeScript для библиотек компонентов
  3. Удаление неиспользуемого кода и автоматический импорт
  4. Публикация в npm и семантическое версионирование
← Назад к Vue Academy