Пакет @aceramica/nuxt-shared

Краткое описание

@aceramica/nuxt-shared — это Nuxt 3 модуль, содержащий переиспользуемые утилиты (utils) и вспомогательные функции, предназначенные для использования во фронтенд-проектах. Позволяет избежать дублирования вспомогательного кода и централизует обработку данных, форматирование и вспомогательные операции

Назначение

Цель пакета — централизовать и стандартизировать набор утилитарных функций, необходимых во всех проектах, и предоставить единый подход к решению типовых задач (дата, строка, числовое форматирование, scroll, транслитерация и т.п.)

Основной функционал

• ✅ Форматирование даты и времени
• ✅ Форматирование чисел и цен
• ✅ Работа со строками (обрезка, транслитерация)
• ✅ Скролл к элементам
• ✅ Склонение числительных

Ключевая структура (относящееся к core-логике)

nuxt-shared/
├─ playground/ # среда для разработки и тестирования
├─ src/
│    ├─ runtime/
│    │   └─ utils/ # каталог с утилитами
│    │       ├─ currentDate.ts
│    │       ├─ declensionOfNumber.ts
│    │       ├─ formattingDate.ts
│    │       ├─ formattingPrice.ts
│    │       ├─ scrollToElement.ts
│    │       ├─ transliterate.ts
│    │       └─ truncateString.ts
│    └─ module.ts # файл с подключением Nuxt модуля и конфигурацией
├─ package.json # зависимости и скрипты для разработки

Утилиты

Функция	Назначение
currentDate()	Возвращает текущую дату в формате dd.mm.yyyy
currentDateTime()	Возвращает текущую дату и время в формате dd.mm.yyyy HH:mm
currentYear()	Возвращает текущий год в формате yyyy
declensionOfNumber()	Склоняет числительные по правилам русского языка
formattingDate()	Форматирует дату в формате dd.mm.yyyy HH:mm, с учётом часового пояса
formattingDateFeed()	Форматирует дату для sitemap/feed в формате yyyy-mm-ddTHH:mm:ss+XX:XX
formattingPrice()	Приводит число к строке с пробелами между тысячами и нужным количеством знаков после запятой
scrollToElement()	Плавно прокручивает страницу до указанного элемента по id
transliterate()	Транслитерация строки с кириллицы на латиницу
truncateString()	Обрезает строку до заданной длины с многоточием

Установка и использование

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

npm install @aceramica/nuxt-shared

Подключение в Nuxt 3 приложения

Добавь модуль в nuxt.config.ts:

export default defineNuxtConfig({
	modules: ['@aceramica/nuxt-shared'],
})

Примеры использования

console.log(currentDate()) // '23.05.2025'
console.log(formattingPrice(12345.67)) // '12 345.67'
console.log(transliterate('Пример строки')) // 'Primer stroki'

Обновление и публикация

Перед публикацией убедись, что:

• Обновлена версия в package.json
• Изменения протестированы в песочнице (playground) и ошибок или багов нет

Публикация:

npm run release

Подробнее о публикации и релизах можно прочитать в разделе Работа с npm-пакетами

Совместимость

Пакет не зависит от версий Nuxt или Vue, так как реализован исключительно на чистом TypeScript и не использует фреймворк-специфичные API

• Не зависит от Nuxt
• Не зависит от Vue
• Поддержка TypeScript: полная (типизация экспортируемых функций, генерация d.ts)

Рекомендации по расширению

• Храни бизнес-логику отдельно, не помещай её в shared-пакет
• Если функционал связан с отображением, добавляй его в @aceramica/layer-common
• Используй только универсальные утилиты, подходящие для всех проектов

Вклад в проект

Локальная разработка

# Установка зависимостей
npm install

# Генерация типов
npm run dev:prepare

# Запуск playground
npm run dev

# Сборка playground
npm run dev:build

# Релиз новой версии
npm run release

Связанные пакеты

• @aceramica/layer-common — слой с общими UI-компонентами