Публикация в npm

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

package.json должен содержать ключевые поля:

"name" — уникальное имя пакета. Рекомендуется использовать формат с namespace для предотвращения конфликтов, например @username/libname.
"version" — семантическая версия (major.minor.patch). В SvelteKit-библиотеках это важно для контроля совместимости.
"main" — путь к основному файлу библиотеки, который будет импортироваться при установке через npm.
"module" — путь к ES-модулю для современных сборщиков.
"types" — путь к TypeScript-типам, если библиотека их предоставляет.
"files" — массив путей, которые должны попасть в пакет при публикации, чтобы исключить лишние файлы, такие как тесты или документация.
"scripts" — команды для сборки, тестирования и подготовки к публикации (build, prepare, prepublishOnly).

Пример:

{
  "name": "@myusername/sveltekit-ui",
  "version": "1.0.0",
  "main": "dist/index.js",
  "module": "dist/index.mjs",
  "types": "dist/index.d.ts",
  "files": ["dist"],
  "scripts": {
    "build": "tsc && vite build",
    "prepare": "npm run build",
    "prepublishOnly": "npm test && npm run build"
  },
  "peerDependencies": {
    "svelte": "^3.0.0"
  }
}

Организация исходного кода

Структура проекта играет ключевую роль для корректной публикации:

sveltekit-ui/
├─ src/
│  ├─ components/
│  ├─ stores/
│  └─ index.ts
├─ dist/
├─ package.json
├─ tsconfig.json
├─ README.md

src/ — исходные файлы Svelte-компонентов и вспомогательных модулей.
dist/ — собранная версия библиотеки. Используется в main и module.
index.ts — точка входа, через которую экспортируются все публичные компоненты и утилиты.

При сборке рекомендуется использовать Vite с SvelteKit-плагином, чтобы корректно генерировались ES-модули и CommonJS-версии, а также TypeScript-типизации.

Настройка сборки и экспорт компонентов

SvelteKit UI библиотеки часто используют комбинацию сборки в ES-модули и CommonJS. Важно экспортировать все компоненты через единый файл index.ts:

export { default as Button } from './components/Button.svelte';
export { default as Modal } from './components/Modal.svelte';
export { themeStore } from './stores/themeStore';

Для обеспечения Tree Shaking необходимо:

Использовать named exports.
Избегать экспорта всего через объект export default { ... }.
Сохранять структуру модулей в dist/, чтобы сборщики потребителей могли импортировать конкретные компоненты напрямую.

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

Для библиотек SvelteKit рекомендуется выделять зависимости в три категории:

dependencies — зависимости, необходимые на runtime. Обычно минимальны, чаще всего это утилиты.
peerDependencies — пакеты, которые должны быть установлены в проекте-потребителе (например, svelte и svelte-kit), чтобы избежать дублирования.
devDependencies — инструменты для сборки и тестирования (vite, typescript, jest, svelte-preprocess).

Пример правильной конфигурации:

"peerDependencies": {
  "svelte": "^3.0.0",
  "@sveltejs/kit": "^1.0.0"
},
"devDependencies": {
  "typescript": "^5.0.0",
  "vite": "^4.0.0",
  "svelte-preprocess": "^5.0.0"
}

Тестирование перед публикацией

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

Проверка сборки командой npm run build.
Локальная установка через npm pack и тестирование в отдельном SvelteKit проекте.
Проверка TypeScript-типов с помощью tsc --noEmit.