Тестовое покрытие на данный момент - 0.0%.
npm install yutu-ui-lib
Тестовое покрытие на данный момент - 0.0%.
Ссылка на npm: https://www.npmjs.com/package/yutu-ui-lib
Публикация новой версии:
1. Внести изменения в код библиотеки.
2. Если добавлен новый UI-компонент — не забыть импортировать его в src/index.ts, чтобы он
стал доступен при установке библиотеки. Также в каждом новом UI-компоненте указывай ссылку на
макет Figma (см. пример в YButton.tsx).
3. Обновить версию в package.json
Пример: "version": "0.1.21" → "version": "0.1.22"
4. Сделать git pull ветки main
5. Выполнить сборку библиотеки: npm run build
6. Закоммитить и запушить изменения в Git
7. Если не зарегистрированы в npm — зарегистрироваться и получить доступ к публикации библиотеки.
8. Опубликовать пакет в npm: npm publish
Обновление библиотеки в другом проекте:
1. Перейти в нужный проект (где используется yutu-ui-lib)
2. Удалить папки зависимостей: rm -rf node_modules package-lock.json
3. Установить обновления: npm install
Инструкция по использованию Storybook в библиотеке компонентов
1. Запуск Storybook
Для локального просмотра компонентов: npm run storybook
2. Структура и размещение историй
Для каждого компонента создаётся отдельный файл с историей.
Истории располагаются рядом с компонентом или в папке stories.
Имя файла должно оканчиваться на .stories.tsx
3. Названия историй
Название истории в Storybook задаётся через поле title, и должно отражать структуру
библиотеки: например как у меня в примере в YButton.stories.tsx: "title: 'YButton'"
Это нужно для удобной навигации в дереве компонентов Storybook.
4. Использование аргументов (Args)
Для настройки пропсов компонента в Storybook используются args.
Все основные параметры (например, disabled, loading, variant, size) должны быть описаны через argTypes.
Это позволяет управлять состоянием компонента прямо в интерфейсе Storybook.
yutu-.
:global() (CSS Modules)
vite.config.ts/css/modules/generateScopedName